用PushButton制作Flash游戏5-键盘输入

原文链接：http://www.brighthub.com/hubfolio/matthew-casperson/articles/78680.aspx

我们已经学会了如何创建游戏角色并把它显示在场景中。现在我们来看看如何用键盘控制角色移动。回想一下，我们的主角(Player)是一个实体(Entity)，它由２个组件(Component)组成。一个是存储空间属性的SimpleSpatialComponent，命名为Spatial。它包含坐标(position)、旋转(rotation)、大小(size)等属性。另一个是负责渲染的SpriteRenderer组件。如果我们编写一个组件能够获取键盘输入，并根据输入改变SimpleSpatialComponent的position属性，就能达到控制主角移动的目的。好，我们就来创建一个这样的组件：KeyboardControllerComponent。这个组件必须不断的刷新才能正确的获取当前的键盘状态。PBE中提供了一个TickedComponent，它里面的onTick()函数会在每一帧中被自动执行。我们就让KeyboardControllerComponent继承自它。

package  
{
    import com.pblabs.engine.components.TickedComponent;
    import com.pblabs.engine.core.InputKey;
    import com.pblabs.engine.entity.PropertyReference;
    import com.pblabs.engine.PBE;
    import flash.geom.Point;
    
    public class KeyboardControllerComponent extends TickedComponent 
    {
        //我们用这个变量来引用Spatial组件中的position属性。
        //教程的第２课中有关于引用组件属性的详细介绍。
        //创建组件时一定不要忘了把这个变量设置好。
        public var positionProperty:PropertyReference;
        
        public function KeyboardControllerComponent() {
            
        }
        //onTick函数每一帧都会被调用，我们就能及时得到键盘输入的变化
        override public function onTick(deltaTime:Number):void {
            super.onTick(deltaTime);
            //获取Spatial组件中的position的值
            var position:Point = owner.getProperty(positionProperty);
            //获取键盘输入
            if (PBE.inputManager.isKeyDown(Keyboard.LEFT)) {
                position.x -= 8;
            }else if (PBE.inputManager.isKeyDown(Keyboard.RIGHT)) {
                position.x += 8;
            }
            if (PBE.inputManager.isKeyDown(Keyboard.UP)) {
                position.y -= 8;
            }else if (PBE.inputManager.isKeyDown(Keyboard.DOWN)) {
                position.y += 8;
            }
            //一定不要忘记把结果传回Spatial组件中
            owner.setProperty(positionProperty, position);
        }
    }

}

下一步，打开level1.xml，把这个新组件添加进去。

<things version="1">
    <entity name="Player">
        <component type="com.pblabs.rendering2D.SimpleSpatialComponent" name="Spatial">
            <position type="">
                <x>0</x>
                <y>0</y>
            </position>
            <spatialManager componentReference="SceneDB"/>
        </component>
        <component type="com.pblabs.rendering2D.SpriteRenderer" name="Render">
            <scene componentReference="SceneDB"/>
            <positionProperty>@Spatial.position</positionProperty>
            <fileName>assets/player.png</fileName>
        </component>
        <component type="KeyboardControllerComponent" name="KeyboardController">
            <positionProperty>@Spatial.position</positionProperty>
        </component>
    </entity>
    <group name="Level1">
        <objectReference name="Player"/>
    </group>
</things>

最后一步，也是经常容易忘记的一步，在主程序中要手动导入并用PBE.registerType()函数注册KeyboardControllerComponent这个类。

package 
{
    import com.pblabs.engine.PBE;
    import com.pblabs.rendering2D.ui.SceneView;
    import flash.display.Sprite;
    import flash.events.Event;
    import com.pblabs.rendering2D.SimpleSpatialComponent;
    import com.pblabs.rendering2D.SpriteRenderer;
    import KeyboardControllerComponent;
    [SWF(width="480", height="384", backgroundColor="0x7F92FF")]
    public class Main extends Sprite 
    {
        
        public function Main():void {
            //注册XML文件中用到的类
            PBE.registerType(com.pblabs.rendering2D.SimpleSpatialComponent);
            PBE.registerType(com.pblabs.rendering2D.SpriteRenderer);
            PBE.registerType(KeyboardControllerComponent);
            
            PBE.startup(this);
            PBE.addResources(new GameResources());
            var sceneView:SceneView = new SceneView();
            PBE.initializeScene(sceneView);
            //载入关卡数据
            PBE.levelManager.load("assets/levelDescriptions.xml", 1);
        }
        
    }
    
}

哈哈，又进了一步，可以控制我们的主角移动了！