白鹭引擎 - 显示对象的基准点与横纵坐标 ( 绘制一个来回移动的绿色方块 )

最新推荐文章于 2021-12-05 22:29:08 发布

weixin_30312659

最新推荐文章于 2021-12-05 22:29:08 发布

阅读量117

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lovling/p/8398602.html

本文介绍了一个使用Egret框架创建简单动画的游戏开发示例。通过实例化形状对象并绘制一个绿色方块，实现了该方块在舞台上左右晃动的效果。此示例展示了如何利用Egret的基本绘图功能及事件监听。

class Main extends egret.DisplayObjectContainer {

    /** 
     * Main 类构造器, 初始化的时候自动执行, ( 子类的构造函数必须调用父类的构造函数 super )
     * constructor 是类的构造函数, 类在实例化的时候调用
     * egret.Event.ADDED_TO_STAGE, 在将显示对象添加到舞台显示列表时调度
     */
    public constructor(){
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
    }

    /**
     * 默认情况下, 显示对象的基准点(锚点)是左上角
     * 可以通过 shp.anchorOffsetX 和 shp.anchorOffsetY 修改基准点, 一般使用默认
     * x, y 的值 就是相对于容器的偏移量, 即横纵坐标
     * 如下画一个左右晃动的绿色方块
     */
    private onAddToStage(event:egret.Event){
        // 实例化一个矢量图显示对象
        var shp:egret.Shape = new egret.Shape();
        shp.graphics.beginFill(0x00ff00);
        shp.graphics.drawRect(0, 0, 100, 100);
        shp.graphics.endFill();
        shp.x = 100;
        shp.y = 100;

        // 将显示对象添加的容器
        this.addChild(shp);

        // 定时修改显示对象的 横纵坐标
        var addNum: number = 15;
        setInterval(function (): void {
            shp.x += addNum;
            shp.y += addNum;
            if(shp.x >= 540) {
                addNum = -15;
            } else if (shp.x < 0) {
                addNum = 15;
            }
        }, 30);
    }
}