EgretEngieのDisplayObjectの表示順番の変え方

こちらの記事EgretEngineで超簡単なゲームを作ってみよう(4) 障害物の実装と各種カプセル化では

const shape = new egret.Shape();
shape.graphics.beginFill(0xff0000);
shape.graphics.drawCircle(0, 0, GameWorld.meterToPixel(BALL_SIZE_METER / 2 ));
shape.graphics.endFill();

this.stage.addChild(shape);       

オブジェクトの表示にegret.DisplayObjectを使い、メイン画面(egret.DisplayObjectContainer)にaddChildして表示をさせています。

表示順番は、追加した順に画面の背後から前面に積みあがっていきます。つまり最後にaddChildしたものが最上位に表示されます。

この表示順を変更するにはどうしたらいいのか？Egret EngineのDeveloper CenterのSampleを見てみます。

        /*** 以下代码三个按钮添加监听事件 ***/
        upBird.addEventListener(egret.TouchEvent.TOUCH_TAP, () => {
            /*** 本示例关键代码段开始 ***/
            this.setChildIndex(upBird, this.numChildren - 1);
            /*** 本示例关键代码段结束 ***/
        }, this );      

もしオブジェクトを一番全面に表示したい場合は、<親のDisplayObjectContainer>.setChildIndex(<対象となるDisplayObject>, <表示位置>);となります。

APIドキュメントでいうとこちらのページ

setChildIndex () method

Public setChildIndex( child:egret.DisplayObject,index:number ):void
対応バージョン:Egret 2.4
対応ランタイム:Web,Native
DisplyObjectContainerに存在する子DisplayObjectの表示位置を変える。他の子オブジェクトの表示位置にも影響を与える。

パラメータ

Child:egret.DisplayObject 表示順を変えたい子オブジェクト
Index number 0より小さいか存在する子の数より大きい数を指定した場合は、最上位に表示されます。

関連メソッド

• addChildAt()
• getChildAt()