Issues with Pixi.js, zIndex, and layers

[edgib102]

So I've been trying for a couple days now to get proper sorting of objects in my scene working. I tried the obvious sprite1.zindex = 2 method, nothing. So I tried to see if pixi layers would work. Nope. The only thing that happens is what's drawn last is the one on top.

Would appreciate any help, because I feel like I'm going insane.

Here's some mockup code I wrote, what's wrong with it?

import * as PIXI from 'pixi.js'
import { Layer } from '@pixi/layers'

let app = new PIXI.Application({
    width:window.innerWidth, 
    height:window.innerHeight,
    backgroundColor:0xb5c69a,
    view: document.getElementById('main-canvas')
});

let layer = new Layer();


const loader = PIXI.Loader.shared;

loader.baseUrl = "images"
loader.add(["untitled.png", "voxel.png"]);

loader.load();

loader.onComplete.add(() => {
    const sprite1 = new PIXI.Sprite.from(loader.resources['untitled.png'].texture);

    sprite1.width = sprite1.width *0.2;
    sprite1.height = sprite1.height *0.2;

    sprite1.parentLayer = layer;
    
    app.stage.addChild(sprite1);



    const sprite2 = new PIXI.Sprite.from(loader.resources['voxel.png'].texture);

    sprite2.width = sprite2.width *0.2;
    sprite2.height = sprite2.height *0.2;

    
    sprite2.parentLayer = layer;
 
    app.stage.addChild(sprite2);

    
    sprite1.zIndex = 2;
    sprite2.zOrder = 1;

    console.log(layer._sortedChildren);
});

Result:

[ivan.popelyshev]

This was solved in discord or in pixijs issues i believe