Flash/Actionscript Tweenはスムーズではありません

Question

私はFlash - Actionscript 3.0を使用してXMLファイルからイメージパス（最終的にはイメージ）をロードし、次にTweenerクラスを使用してヘッダーをスクロールさせます。

問題点：スクロールが滑らかではなく、非常に不安定で、理由を理解できません。

私は、ビットマップスムージングを有効にするとウェブ上で読んだことがありますが、XMLから読み込まれた画像ではどうすればよいかわかりません。

コードが必要な場合は投稿することができますが、かなり長くなるので、最初はこの誰かがこの不安定なトゥイーンの一般的な理由を考えることができないと思いました。あなたは...など、当社のいずれかのページでスクロールをチェックアウト

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

感謝することができます！

EDIT：コード

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ローダーを追加しないでください。

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 
} 

（私の視点から悪い習慣）

addChild(imageLoader); 

代わりに、このようにそれを行います

アニメーションが不安定になる理由は、遅くなることです。

フラッシュムービーの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); 
}