Problem with zOrder

[Heffalumpen]

I don't really know if this is a zOrder problem, as I've tried to adjust it. I'm creating a action menu for when the user clicks an object, user clicks the object this menu is shown down in the right corner. But there is something wrong with the ordering.

As you can see there are three options; A, B and C. However A text is placed under the Sprite.

The blue bubble is a sprite, created and added to the container.

'A' text is text, created and added to the container, after the blue bubble.

I've tried to set both zIndex. blue bubble to 0, and text to 999. No effect.

I've tried to add text as a child of the sprite as children should be placed above the parent. No effect.

Source for the menu where I add the components to the parent container:

var sprite = new PIXI.Sprite.from('assets/background.png');
sprite.anchor.x = 0.5;
sprite.anchor.y = 0.5;
sprite.position.x = -100;
sprite.position.y = 50;

var text = new PIXI.Text('A',{fontFamily : 'Arial', fontSize: 24, fill : 0xff1010, align : 'center'});
text.anchor.x = 0.5;
text.anchor.y = 0.5;
text.position.x = -100;
text.position.y = 60;

var container = new PIXI.Container();
container.addChild(sprite);
container.addChild(text);

this.stage.addChild(container);

 

 

[jonforum]

show code plz

[ivan.popelyshev]

Generally, order of drawing is the same as order in the stage tree and in children. zIndex works only in pixi-v5.

> 'A' text is text, created and added to the container, after the blue bubble.

Then it cant be behind it. Please share the code.

[Heffalumpen]

34 minutes ago, jonforum said:

show code plz

 

30 minutes ago, ivan.popelyshev said:

Generally, order of drawing is the same as order in the stage tree and in children. zIndex works only in pixi-v5.

> 'A' text is text, created and added to the container, after the blue bubble.

Then it cant be behind it. Please share the code.

I've added the code... very simple I thought. 

[ivan.popelyshev]

Look, it works! https://www.pixiplayground.com/#/edit/sdPIQklu4AEKafV9dAaaD

[jonforum]

oh sorry I misunderstood your problem, I thought you was use Ivan's plugin.
https://github.com/pixijs/pixi-display/blob/bc4e80174c0b2f4769431d6b2f7f354787789630/dist/pixi-layers.js#L112
Because your talk about zOrder  !
And pixi-display allow pixi to manage zOrder  and zIndex.
 

when your do

    var container = new PIXI.Container();
    container.addChild(sprite,text);

they have no reason here to not work ! 
your issue is maybe more deep !  your made a mistake somewhere

[Heffalumpen]

21 hours ago, jonforum said:

oh sorry I misunderstood your problem, I thought you was use Ivan's plugin.
https://github.com/pixijs/pixi-display/blob/bc4e80174c0b2f4769431d6b2f7f354787789630/dist/pixi-layers.js#L112
Because your talk about zOrder  !
And pixi-display allow pixi to manage zOrder  and zIndex.
 

when your do

    var container = new PIXI.Container();
    container.addChild(sprite,text);

they have no reason here to not work ! 
your issue is maybe more deep !  your made a mistake somewhere

I dug deep and found the problem. I actually mixed the order up as I first add the backgrounds, and then the text! Thanks for pointing this out!