Sign in to follow this  
Heffalumpen

Problem with zOrder

Recommended Posts

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.zqSLhhq.png

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);

 

 

Share this post


Link to post
Share on other sites
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. 

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites
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!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.