Jump to content

sending to back not working?


Recommended Posts

I have a background image that takes up my whole window.  It renders in front of my text, even when all in a group, and using sendToBack isn't working.  It renders behind my graphics, which is good, but why isn't my text coming forward as well?


create: function(){
    this.titles = this.game.add.group();
    this.bg= this.game.add.sprite(0,0, 'bg');
    this.logo = this.game.add.sprite(this.game.world.centerX, this.game.world.centerY -200, 'logo');
  //text for instructions 
    this.style = {font: "26px Arial", fill: '#fff'};
    this.text1 =this.game.add.text(this.game.world.centerX, this.game.world.centerY, 'Instructions: blah de blah de blah.', this.style, this.titles);
    //start button
    this.startbtn=this.game.add.button(this.game.world.centerX, this.game.world.height-100,'start',this.startGame,this,1,0,1);


Link to comment
Share on other sites

Hi Casey.

Children of a group will be rendered in the order in which they are added (unless of course you change the order with functions like sendToBack()).

Because you add the background first, it will be rendered before everything else (so you don't need the call to sendToBack() on bg), and the text should appear on top - https://jsfiddle.net/gauravdixitv/r6v7sLkw/

Perhaps, you are changing the group's order somewhere else in your code?

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...