Z-Index in Nested Sprite

[dan_armstrong]

When using a nested sprite (all children added with addChild), is there any way to control the z-index of the children? I had originally went with a Group for this task but I need the object to support physics, so I rewrote it with Sprite. I basically just need to be able to bring the parent sprite above the children.

 

If I'm explaining this awfully then just tell me and I will try to make it more clear.

[JUL]

mychild.bringToTop() ?

 

I guess you already tried that.

[dan_armstrong]

Yea, I can raise the children like that but I need to raise `this`. I tried this.bringToTop() and that didn't work either.

[dan_armstrong]

Here is the source code I'm working with 

/** * Ugly prototype code to prove that Phaser is * an acceptable framework for Google to use. * * Created by dan on 9/10/14. */var VideoPanel = function(app, data) {    this.app = app;    this.pulloutActive = false;    this.baseScale = 1;    var baseX = app.world.centerX;//app.world.randomX;    var baseY = app.world.centerY;//app.world.randomY;    Phaser.Sprite.call(this, app, baseX, baseY, 'video_panel');    this.anchor.setTo(0.5, 0.5);    this.scale.x = this.baseScale;    this.scale.y = this.baseScale;    var bounds = this.getBounds();    this.expand = app.add.sprite(0, 0, 'expand');    this.expand.anchor.setTo(0.5, 0.5);    this.expand.x = (bounds.right - (this.expand.width / 2)) - (15 * this.baseScale);    this.expand.y = (bounds.bottom - (this.expand.height / 2)) - (15 * this.baseScale);    this.expand.inputEnabled = true;    this.expand.events.onInputDown.add(this.expandEvent, this);    this.addChild(this.expand);    /* Pullout objects */    this.pulloutGroup = app.add.group();    this.pullout_panel = this.pulloutGroup.create(baseX, baseY, 'pullout_panel');    this.pullout_panel.anchor.setTo(0.5, 0.5);    this.pullout_panel.x = (bounds.right - (this.pullout_panel.width / 2)) + (40 * this.baseScale);    this.pullout_panel.y = bounds.centerY;    var pBounds = this.pullout_panel.getLocalBounds();    this.pullout_arrow = this.pulloutGroup.create(baseX, baseY, 'pullout_arrow');    this.pullout_arrow.anchor.setTo(0.5, 0.5);    this.pullout_arrow.x = pBounds.right; // This doesn't work as expected    this.pullout_arrow.y = 0;    this.pullout_arrow.inputEnabled = true;    this.pullout_arrow.events.onInputDown.add(this.pulloutEvent, this);    this.addChild(this.pulloutGroup);    // Video Panel Text    this.titleText = app.add.text(        baseX,        baseY,        "Video title goes here",        {            font: "12px Open Sans",            fill: "#000000",            align: "center"        }    );    this.titleText.anchor.setTo(0.5, 0.5);    this.titleText.x = bounds.left + (this.titleText.width / 2);    this.titleText.y = bounds.bottom - (35 * this.baseScale);    this.authorText = app.add.text(        baseX,        baseY,        "by Name Here",        {            font: "10px Open Sans",            fill: "#000000",            align: "center"        }    );    this.authorText.anchor.setTo(0.5, 0.5);    this.authorText.x = bounds.left + (this.authorText.width / 2);    this.authorText.y = bounds.bottom - (20 * this.baseScale);    this.bringToTop();    this.addChild(this.titleText);    this.addChild(this.authorText);};VideoPanel.prototype = Object.create(Phaser.Sprite.prototype);VideoPanel.prototype.constructor = VideoPanel;VideoPanel.prototype.expandEvent = function() {};VideoPanel.prototype.pulloutEvent = function() {    this.pulloutActive = !this.pulloutActive;    if(this.pulloutActive) {        this.app.add.tween(this.pulloutGroup).to( { x: (150 * this.baseScale) }, 1400, Phaser.Easing.Bounce.Out, true);    } else {        this.app.add.tween(this.pulloutGroup).to( { x: 0 }, 1400, Phaser.Easing.Bounce.Out, true);    }    this.pullout_arrow.scale.x = (this.pulloutActive) ? -1 : 1;}; 

[wayfinder]

You could try making the parent a sprite without a texture and create the actual parent as the topmost child.

[dan_armstrong]

That did the trick. I had considered it but thought there might be a better way. Thank you very much.