如何为精灵设置动画？答案

【问题标题】：How do I animate a sprite?如何为精灵设置动画？
【发布时间】：2010-11-10 21:14:24
【问题描述】：

我正在使用 Flex 和 AS3 来尝试创建游戏，我想知道如何轻松地制作动画。我更喜欢使用精灵表图像。我要去头并发布代码（它真的很短）我到目前为止，有人可以看看它并告诉我添加动画支持的最佳/最简单/最简单的方法吗？提前谢谢你。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
  styleName = "plain"
    xmlns="cyanprime.*" 
    layout="absolute"
    width="600"
    height="400"
    frameRate="100"
    applicationComplete="initApp()">

    <mx:Script>
        <![CDATA[
            public function initApp():void
            {
                stage.addEventListener(KeyboardEvent.KEY_UP, keyUp); 
                stage.addEventListener(KeyboardEvent.KEY_DOWN, keyDown); 
                Mouse.hide();
                canvas.init();

            }

            private function keyDown(event:KeyboardEvent):void
            {
                canvas.KeyDownHandler(event);
            }

            private function keyUp(event:KeyboardEvent):void
            {
                canvas.KeyUpHandler(event);
            }
        ]]>
    </mx:Script>

  <MyGameCanvas id="canvas" width="100%" height="100%" themeColor="#ff0000" />
</mx:Application>

...

package cyanprime{

    import mx.core.UIComponent;
    import mx.controls.Image;
    import flash.events.*;
    import flash.utils.*;
    import flash.display.*;
    import flash.ui.Keyboard;

    public class MyGameCanvas extends UIComponent{
        [Embed(source="player.gif")]
        private var playerImage:Class;
        private var playerSpeed:int = 5;
        private var keys:Array = new Array();
        private var player:DisplayObject = new playerImage();
        private var ticker:Timer;



        public function init():void{
            // set up player
            player.x = 50;
            player.y = 50;
            addChild(player);

            for(var i:int = 0; i < 300; i++)
            {
                keys[i] = false;
            }

            ticker = new Timer(10); 
            ticker.addEventListener(TimerEvent.TIMER, onTick);
            ticker.start();

        }

        public function controls():void{
            if(keys[Keyboard.RIGHT])
                player.x += playerSpeed;

            if(keys[Keyboard.LEFT])
                player.x -= playerSpeed;

            if(keys[Keyboard.UP])
                player.y -= playerSpeed;

            if(keys[Keyboard.DOWN])
                player.y += playerSpeed;
            }

        public function KeyDownHandler(event:KeyboardEvent):void{   
            keys[event.keyCode] = true;

        }

        public function KeyUpHandler(event:KeyboardEvent):void{
            keys[event.keyCode] = false;
        }

        public function onTick(evt:TimerEvent):void {
            controls();
        }       
    }
}

【问题讨论】：

标签： flash actionscript-3 flux

【解决方案1】：

您可以使用诸如TweenLite 之类的补间库，这可能是最简单的方法。如果您想了解 Actionscript 中动画制作的具体细节，Actionscript 3.0 Animation by Keith Peters 这本书是首屈一指的。

【讨论】：