幻燈片樣式導航。 addChild＆arrays

Question

希望在這裏得到一些建議。對於iPad演示文稿的基本導航系統似乎存在問題。

對於這個例子，我已經將我的庫中的5個頁面添加到數組中。 我想要的效果是，當用戶滑動到下一頁時，它應該： - 使用addChild將下一頁添加到舞臺（視圖外） - 補間當前頁面的視圖，補間下一頁到視圖 - 使用removeChild刪除舊頁面。

這樣做的原因是我會有大量的重動畫頁面，我試圖避免讓他們全都出現在舞臺上，以防止FPS下降。

這是我的代碼到目前爲止。我嘗試了一些東西，例如試圖重新設置currentPage，但沒有運氣。現在拉着我的頭髮幾個小時！

import com.greensock.*; 
import com.greensock.easing.*; 
import com.greensock.plugins.*; 
import flash.events.MouseEvent; 
import flash.display.MovieClip; 

//touch device swiping 
Multitouch.inputMode = MultitouchInputMode.GESTURE; 
stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeHandler_2); 
function fl_SwipeHandler_2(event:TransformGestureEvent):void{ 
    switch(event.offsetX) 
    { 
     //swiped right, go back 
     case 1: 
     { 
      prevPage(); 
      break; 
     } 
     //swiped left, go forward 
     case -1: 
     { 
      nextPage(); 
      break; 
     } 
    } 
} 

//fill array with movieclip pages from library 
var pageArray:Array = [page1, page2, page3, page4, page5]; 
var currentArray:Number = 0; 

//add the first page in the array to the stage as 'currentPage' 
var currentPage:MovieClip = new pageArray[currentArray]; 
addChild(currentPage); 

function nextPage(event:TouchEvent):void{ 
    if (currentArray < pageArray.length - 1){ 

      //tween currentPage out to the left, when animation ends removeChild(currentPage); 
      TweenMax.to(currentPage, 1, {x:-1024,onComplete:removeChild,onCompleteParams:[currentPage]}); 
      //move to the next item in the array 
      currentArray++ 
      //add the next item in the array to the stage as 'newPage' 
      var newPage:MovieClip = new pageArray[currentArray] 
      addChild(newPage); 
      newPage.x = 1024; 
      //tween newPage into view 
      TweenMax.to(newPage, 1, {x:0,onComplete:updatePage}); 

      /* 
      PROBLEM STARTS HERE: 
      - if nextPage is executed again, it will try to tween 'currentPage' which has been removed from the stage. 
      - need to rename/change 'newPage' into 'currentPage' here but don't know how. 
      */ 

    } 
} 

function prevClicked(event:MouseEvent):void{ 
    if (currentArray > 0){ 
     trace("same as nextPage in reverse"); 
    } 
} 

編輯的問題解決了

因此與aesphere的幫助和一些試驗和錯誤，這似乎是現在的工作。其中一個主要問題是缺少圍繞數組的新的和（），例如：new page1（），new page2（）。等等。

Multitouch.inputMode = MultitouchInputMode.GESTURE; 

stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE, fl_SwipeHandler_2); 

function fl_SwipeHandler_2(event:TransformGestureEvent):void 
{ 
    switch (event.offsetX) 
    { 
     case 1 : 
      { 
       prevPage(); 
       break; 

      }; 
     case -1 : 
      { 
       nextPage(); 
       break; 

     } 
    } 
}; 


import com.greensock.*; 
import com.greensock.easing.*; 
import com.greensock.plugins.*; 
import flash.events.MouseEvent; 
import flash.display.MovieClip; 


var pageArray:Array = [new page1(), new page2(), new page3(), new page4(), new page5()]; 
var currentPage:Number = 0; 

addChild(pageArray[currentPage]); 

function nextPage():void 
{ 
    if (currentPage < pageArray.length - 1) 
    { 
     TweenMax.to(pageArray[currentPage], 1, {x:-1024, onComplete:removeChild, onCompleteParams:[pageArray[currentPage]]}); 
     currentPage++; 
     pageArray[currentPage].x = 1024; 
     addChild(pageArray[currentPage]); 
     TweenMax.to(pageArray[currentPage], 1, {x:0}); 
    } 

} 

function prevPage():void 
{ 
    if (currentPage > 0) 
    { 
     TweenMax.to(pageArray[currentPage], 1, {x:1024, onComplete:removeChild, onCompleteParams:[pageArray[currentPage]]}); 
     currentPage--; 
     pageArray[currentPage].x = -1024; 
     addChild(pageArray[currentPage]); 
     TweenMax.to(pageArray[currentPage], 1, {x:0}); 
    } 
} 

Answer 1

頁面之間的簡單導航應該只是使用變量來跟蹤哪個頁面是當前頁面。你已經描述了你想要做的事情，但是你已經做出了比你的代碼更復雜的事情。

由於您有一個跟蹤當前頁面的計數器變量，因此您應該只使用已經具有的頁面數組，以便根據需要添加addChild和removeChild，這樣您就有了一個控制點，其中currentPage始終引用當前動畫片段在pageArray內的舞臺上。

從您的代碼

所以：

import com.greensock.*; 
import com.greensock.easing.*; 
import com.greensock.plugins.*; 
import flash.events.MouseEvent; 
import flash.display.MovieClip; 

//I like to setup the required assets and variables first, then put everything else below: 
//fill array with movieclip pages from library 
var pageArray:Array = [page1, page2, page3, page4, page5]; 
var currentPage:Number = 0; 

//Next we add the first page to the stage 
addChild(pageArray[currentPage]); 

//Now we add the listeners for the functionality 
Multitouch.inputMode = MultitouchInputMode.GESTURE; 
stage.addEventListener (TransformGestureEvent.GESTURE_SWIPE, fl_SwipeHandler_2); 
function fl_SwipeHandler_2(event:TransformGestureEvent):void{ 
    switch(event.offsetX) 
    { 
     //swiped right, go back 
     case 1: 
      prevPage(); 
      break; 
     //swiped left, go forward 
     case -1: 
      nextPage(); 
      break; 
    } 
} 

//The handlers for the swiping gestures for switch pages 
function nextPage(event:TouchEvent):void 
{ 
    //First check if we have a next page or not. 
    if (currentPage < pageArray.length - 1){ 
     //So, we want to move to the next page, we first Tween the current page off to left 

     TweenMax.to(pageArray[currentPage], 1, {x:-1024, onComplete:removeChild, onCompleteParams:[pageArray[currentPage]]}); 
     //Once the Tween starts,increment the page counter, set the starting xpos, addChild 
     //and then tween that into place. 
     currentPage++; 
     pageArray[currentPage].x = 1024; 
     addChild(pageArray[currentPage]); 
     //Tweening into place then calls the updatePage when tween is complete. 
     TweenMax.to(pageArray[currentPage], 1, {x:0, onComplete:updatePage}); 
    } 

} 

function prevPage(event:TouchEvent):void 
{ 
    trace('pretty much nextPage but decrementing currentPage plus a check against 0'); 
} 

希望這些意見將是有意義的。嘗試給這個去。