Egret2D有关Camera模拟的思考

上文说到在开发跑酷游戏中遇到了些问题,比如摄像机,我再思考Egret中主要通过渲染Stage,然后实现显示,我们是否完全可以通过控制Stage或者根目录级别的容器的x、y以及ScaleX和ScaleY来进行模拟摄像机的(Camera)情况,因为这里主要是2D开发的游戏,所以我们不考虑Y轴方向旋转。3D的可以直接使用Egret3D直接参考上篇文章。
下面我们来做一个测试,首先我们准备好Texture和一个简单的对象纹理图。

然后设置一个CameraController来实现模拟摄像机的效果如下:


class CameraController extends BaseController {
    public constructor() {
        super();
        this.registerFunc(ActionConst.Create, this.onCreate, this);
    }

    private onCreate():void {
        
    }

    public Left() {
        this.app.root.$setX(this.app.root.$getX() - 0.33 * this.app.timerManager.dt);
    }

    public Right() {
        this.app.root.$setX(this.app.root.$getX() + 0.33 * this.app.timerManager.dt);
    }

    public Up() {
        this.app.root.$setY(this.app.root.$getY() - 0.33 * this.app.timerManager.dt);
    }

    public Down() {
        this.app.root.$setY(this.app.root.$getY() + 0.33 * this.app.timerManager.dt);
    }

    public ScaleBig() {
        this.app.root.$setScaleX(this.app.root.$getScaleX() * 0.99);
        this.app.root.$setScaleY(this.app.root.$getScaleY() * 0.99);
    }

    public ScaleSmall() {
        this.app.root.$setScaleX(this.app.root.$getScaleX() / 0.99);
        this.app.root.$setScaleY(this.app.root.$getScaleY() / 0.99);
    }
}

其中app.root表示根节点,然后对象与root显示节点位于不同的层级,然后通过控制root节点位置来模拟移动如下:


然后其中道具金币均在root层级上,然后为了实现景深,可以指定多层root,每层root移动速率不一样,然后所有障碍及碰撞均位于最外层的root层面上即可。

欢迎留言

avatar
  Subscribe  
Notify of