Flash/Actionscript補間不平滑

Question

我正在使用Flash - Actionscript 3.0 - 從XML文件加載圖像路徑（最終是圖像），然後我使用Tweener類來爲補間進行動畫滾動以跨頁眉進行滾動。

問題：滾動不光滑，其相當波濤洶涌，我找不出原因。

我已經讀過網絡，使位圖平滑幫助，但我不知道如何做到這一點與從XML加載的圖像。

如果您需要我可以發佈的代碼，但其相當長，所以我認爲如果有人可以想到這種不穩定的補間的一些常見原因，我最初不會。您可以在我們的網頁如一個檢查出滾動...

http://community.greencupboards.com/2011/07/15/lions-fighting-extinction/

謝謝！

編輯：代碼請求

import fl.transitions.Tween; 
import fl.transitions.easing.*; 
import fl.transitions.TweenEvent; 
import caurina.transitions.* 

var imageLoader:Loader; 
var currentLoader:Loader; 
var xml:XML; 
var xmlList:XMLList; 
var xmlLoader:URLLoader = new URLLoader(); 
var xmlLoader2:URLLoader = new URLLoader(); 
var k:int; 
var iterator:int = 0; 
var imageCount:int; 

//********** Begin editable region *************/// 
//--------------------------------------------- 
//dont change startX unless you are sure -> 
//start coordinates are affected by more than this variable 
var startX:Number = 690; 
//change endX to extend the scroll length 
var endX:Number = 20; 
//change scrollSpeed to change speed of images 
var scrollSpeed:Number = 32; 
//--------------------------------------------- 
//********** End editable region **************/// 

var ratio:Number = scrollSpeed/(startX-endX); 
var rate:Number = (startX-endX)/scrollSpeed; 

//align tabs under heading 
setChildIndex(headertab,1); 

// ----- Program Main ----- // 
initializeMouseEvents(); 
Main_Begin(); 

//@ initializes mouse events for url navigation 
function initializeMouseEvents():void 
{ 
Mouse.cursor = flash.ui.MouseCursor.BUTTON 
headertab.addEventListener(MouseEvent.ROLL_OVER, expandTab); 
headertab.addEventListener(MouseEvent.ROLL_OUT, shrinkTab); 
function expandTab(e:MouseEvent):void 
{ 
    Tweener.addTween(headertab, {y:5, time:.1, delay:0, transition:"linear"}); 
} 
function shrinkTab(e:MouseEvent):void 
{ 
    Tweener.addTween(headertab, {y:0, time:.1, delay:0, transition:"linear"}); 
} 
stage.addEventListener(MouseEvent.CLICK, onClick); 
function onClick(e:MouseEvent):void 
{ 
    navigateToURL(new URLRequest("http://www.greencupboards.com"), "_blank"); 
} 
} 

function Main_Begin():void 
{ 
xmlLoader.load(new URLRequest("http://www.greencupboards.com/media/community/scroll/images.xml")); 
xmlLoader.addEventListener(Event.COMPLETE, loadInitialXml); 

function loadInitialXml(event:Event):void 
{ 
    xml = XML(event.target.data); 
    xmlList = xml.children(); 
    imageCount = xmlList.length(); 
    for(var j:int = 1; j < 10; j++) 
    { 
     k = imageCount - j; 
     imageLoader = new Loader(); 
     imageLoader.name = "loader"+j; 
     imageLoader.load(new URLRequest(xmlList[k].source)); 
     imageLoader.x = endX + 60*(j+1) + 10; 
     imageLoader.y = 37; 
     //imageLoader.addEventListener(MouseEvent.ROLL_OVER, pauseAll); 
     //imageLoader.addEventListener(MouseEvent.ROLL_OUT, resumeAll); 
     addChild(imageLoader); 
     setChildIndex(imageLoader,1); 
     //Tweener.addTween(imageLoader, {alpha:1, time:1.4, delay:0, transition:"linear"}); 
     Tweener.addTween(imageLoader, {x:endX, time:rate*(j+1)/7.2, delay:0, transition:"linear"}); 
     Tweener.addTween(imageLoader, {alpha:0, time:2, delay:(rate*(j+1)/7.5)-4, transition:"linear"}); 
     imageLoader.unload(); 
    } 

    //first scrolling images to fade in 
    loadXML(); 
    //loop of scrolling images infinetely 
    function loop():void 
    { 
     loadXML(); 
    } 
    setInterval(loop,( ((imageCount*60))/rate)*1000 ); 

//imageLoader.name = xmlList[i].attribute("source"); 
} 
} 

function loadXML() 
{ 
xmlLoader2.load(new URLRequest("http://www.greencupboards.com/media/community/scroll/images.xml")); 
xmlLoader2.addEventListener(Event.COMPLETE, xmlLoaded); 

function xmlLoaded(event:Event):void 
{ 
    xml = XML(event.target.data); 
    xmlList = xml.children(); 
    imageCount = xmlList.length(); 
    for(var i:int = 0; i < xmlList.length(); i++) 
    { 
     imageLoader = new Loader(); 
     imageLoader.name = "loader"+i; 
     imageLoader.load(new URLRequest(xmlList[i].source)); 
     imageLoader.x = startX + 60*i; 
     imageLoader.y = 37; 
     imageLoader.alpha = -1; 
     //imageLoader.addEventListener(MouseEvent.ROLL_OVER, pauseAll); 
     //imageLoader.addEventListener(MouseEvent.ROLL_OUT, resumeAll); 
     addChild(imageLoader); 
     setChildIndex(imageLoader,1); 
     makeTween(imageLoader); 
     iterator++; 
    } 
iterator = 0; 
//imageLoader.name = xmlList[i].attribute("source"); 
} 
} 

function resumeAll(event:Event):void 
{ 
    Tweener.resumeAllTweens(); 
} 

function pauseAll(event:Event):void 
{ 
    Tweener.pauseAllTweens(); 
} 

function makeTween(obj:Loader):void 
{ 
Tweener.addTween(obj, {alpha:1, time:2, delay:60*ratio*iterator+3.3, transition:"linear"}); 
Tweener.addTween(obj, {x:endX, time:(scrollSpeed + 60*ratio*iterator), delay:0, transition:"linear", onComplete:unloadObject(obj)}); 
} 

function unloadObject(obj:Object):void 
{ 
//iterator - 2 simply creates a big enough delay. I think the scroll gets ahead of fadeout so it needs this buffer to run many times 
Tweener.addTween(obj, {alpha:0, time:2, delay:(scrollSpeed + 60*ratio*(iterator-2)), transition:"linear"}); 
obj.unload(); 
} 

Answer 1

有時候更好的做動畫的方法是使用ENTER_FRAME事件手動動畫。

我的建議：擺脫Tweener並編寫自己的動畫循環。

package 
{ 
    import flash.display.Sprite; 
    import flash.events.Event; 

    [SWF(width="400", height="100", frameRate="30", backgroundColor="#FFFFFF")] 
    public class Main extends Sprite 
    { 
    private var items : Array; 
    public function Main() 
    { 
     items = []; 
     var curx:int = 0; 
     // create some items 
     for (var i:int=0;i<10;i++) 
     { 
      var s:Sprite = new Sprite(); 
      s.x = curx; 
      s.graphics.beginFill(0xff0000*i/10, 1); 
      s.graphics.drawRect(0, 0, 20, 40); 
      items.push(s); 

      addChild(s); 
      curx += s.width + 6; 
     } 
     addEventListener(Event.ENTER_FRAME, onEnterFrame); 
    } 

    private function onEnterFrame(event : Event) : void 
    { 
     var i:int = items.length-1; 
     var s:Sprite; 
     while (i >= 0) 
     { 
      s = items[i] as Sprite; 
      if (s.x <= -20) { 
       s.x = stage.stageWidth; 
      } 
      s.x -= 2; 
      --i;     
     } 
    } 
    } 
} 

和運行例如：http://wonderfl.net/c/nhhM

歡呼

Answer 2

UPDATE

不要directrly添加加載器階段。 （從我的角度來看不好的做法）

addChild(imageLoader); 

，而不是像這樣做：

imageLoader.loaderInfo.addEventListener (Event.COMPLETE, handleLoadComplete); 

ORIGINAL

這是你如何能順利位：

private function handleLoadComplete (e : Event) : void 
{ 
    imageLoader.loaderInfo.removeEventListener(Event.COMPLETE, handleLoadComplete); 
    var bitmap:Bitmap = Bitmap (loader.content); //get the loaders content as a bitmap 
    bitmap.smoothing = true;//turn on smoothing 
    location.addChilc (bitmap) // add the bitmap to you desired location 
} 

動畫不穩定的原因是它會減慢速度。

增加Flash動畫的FPS。並增加動畫的速度。

Answer 3

如果你想編程的動畫做的，我會建議使用TweenLite的圖書館（http://www.greensock.com/tweenlite /）。我將在下面編寫一個小例子來向你展示動畫是多麼容易。

private function startAnimation():void 
{ 
    for each(var yourImage:Bitmap in SomeArrayYouCollectTheImagesIn) 
    { 
     TweenLite.to(yourImage, timeItShouldTake, {x: X-PositionToGoTo, onComplete: someFunction, onCompleteParams: [yourImage]}); 
    } 
} 

private function someFunction(image:Bitmap):void 
{ 
    //You can reposition your image here 
} 

private function stopAnimation(image:Bitmap):void 
{ 
    TweenLite.killTweensOf(image); 
}