Jump to content

Text doesn't show


Recommended Posts

Hello, fellow Phasorians!

Using Phaser 2.2.1 and Canvas renderer.


I have a weird problem which is most probably not a bug within Phaser, but it's something that I'm doing wrong.

I've added a text instance using game.text.add(20,20,"hello",style) in the create() method, but for some reason it doesn't show up!


I'm also rendering a tilemap on the canvas (tilemap is created AFTER the text instance). When I enable the layer.debug on all layers and set some alpha values around 0.3, I can see the text! However it's not the color I've defined (white fill with black stroke), instead it blends with the background (tilemap).

If I don't set the style (black font), it doesn't show at all.


I create the text instance within the create() method and the tilemap instance after the create() has been executed. I've tried setting the text.z property, but it doesn't seem to make a difference.


I'm not currently posting code, because I have feeling it's something really obvious I'm missing!

Link to comment
Share on other sites

How should I solve this considering I need the text instance available from the moment create() is called and until the end of the game.

However the tilemap instance will be created some time after the create() is called (the server notifies clients when the tilemap instance is to be created). Tilemap cannot be created before text because the client doesn't know which tilemap it will load.

Link to comment
Share on other sites

Groups are your friends...

Use them as render layers...


I'd do it this way:
Create a group, add it to the game, call it tilemap_layer...

Create a group, add it to the game, call it overlay_layer...

Create your text, add it to the overlay_layer...

Whenever you create your tilemap, add the created layers to the tilemap_layer...


Because Phaser.Groups are display object containers, the order they are created is the order they and their children are rendered...

Because Tilemaps return TilemapLayer objects, which extend Phaser.Image, when the Tilemap is created, the layers can easily be added to your draw layer...

Link to comment
Share on other sites

  • 2 years later...

I came on this as a way to switch background images:
in preload:
  game.load.image('map.one'       , 'images/map1.png'      ) ;
  game.load.image('map.two'       , 'images/map2.png'      ) ;
var MAP1             ;     
var MAP2             ;   
in create:
MAP1             = game.add.group();
MAP2             = game.add.group();
in game some function

var one = MAP1.create( 0,  0, 'map.one' ) ;
when I want to change the background....

 MAP1.callAll('kill');  // erase MAP1

then I call.

var two = MAP2.create( 0,  0, 'map.two' ) ;

I found this timer example and want to display time on the screen.

// http://jsfiddle.net/lewster32/vd70o41p/

here is how I display the scores.


// function Onscore()

   //  1  = game.add.text(  16,  (h- ( h/10))+10 , 'score: 0'   , { fontSize: '18px', fill: '#f80c15' });

   //  2 = game.add.text( 216,  (h- ( h/10))+10  , 'Bunnies: 0'   , { fontSize: '18px', fill: '#f80c15' });

   //  3 = game.add.text( 516,  (h- ( h/10))+10  , 'burgers: 0', { fontSize: '18px', fill: '#f80c15' });

  //  TimeText = game.add.text( 816,  (h- ( h/10))+10  , 'time: ', { fontSize: '18px', fill: '#f80c15' });


as the example works I 'guess' I am choosing to mis identify the text container after many attempts.


Link to comment
Share on other sites


  • Recently Browsing   0 members

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