Pixi.js: 並べ替え可能な表示オブジェクト

children配列内のオブジェクトの順序は、オブジェクトがレンダリングされる順序です。 つまり、配列の最後のものが「上」にレンダリングされます

今、私は少し馬鹿げたxDを感じます
ソースコードを読んでいると、renderDisplayObjectにリンクリストが表示され、このリリースではstage.children配列がなくなったと思いました...。
気にしないでください、それはstage.childrensortでうまく機能しています:)

ところで、1.3.0のパフォーマンスは素晴らしいです！ cocoonjsでWebGLのものをテストするための小さなコードを完成させています

ありがとうございました ：）

問題ありません、PIXIがあなたのために働いてくれてうれしいです！

var mapContainer = new PIXI.DisplayObjectContainer(),
    unitsContainer = new PIXI.DisplayObjectContainer(),
    menuContainer = new PIXI.DisplayObjectContainer();

mapContainer.zIndex = 5;
unitsContainer.zIndex = 10;
menuContainer.zIndex = 20;

/* adding children, no matter in which order */
stage.addChild(mapContainer);
stage.addChild(menuContainer);
stage.addChild(unitsContainer);

/* call this function whenever you added a new layer/container */
stage.updateLayersOrder = function () {
    stage.children.sort(function(a,b) {
        a.zIndex = a.zIndex || 0;
        b.zIndex = b.zIndex || 0;
        return b.zIndex - a.zIndex
    });
};

stage.updateLayersOrder();

子配列はreadonly

@glebmachineは、「ソート」を呼び出せないという意味ではありません

@tengotengoありがとうございます！ あなたのソリューションはシンプルでありながらエレガントです。

@tengotengoのソリューションは本当にこれに対する最終的なソリューションですか？ z-indexを変更できることは、私にとって主要な機能のようです。 y軸に応じて、あるスプライトが別のスプライトの後ろまたは前にあると見なされるアイソメトリックゲームを想像してみてください。 z-indexを実行することは、これを処理する従来の方法です。その場合、スプライトの下部のy位置をz-indexにマップして完了します。 今のところ、ソートハックを行いますが、これには公式の解決策があるはずです。

@bluefeethttps ：//github.com/pixijs/pixi-displayをご覧ください
必要な機能が得られると思います

2017年にこの機能を探しているなら、 PixiではzOrderとして実装されています。

https://pixijs.github.io/examples/#/display/zorder.js

@loadedsith pixi -displayが最新バージョンに更新され、TSで書き直されました。今週は、多くの例を含む巨大なパッチがあります。

このスレッドは、閉じられた後に最近のアクティビティがないため、自動的にロックされています。 関連するバグについては、新しい問題を開いてください。