Jump to content

add.bitmapText in Phaser ver 2.4.4


Recommended Posts

Hi, I am currently starting to learn Phaser and am following this tutorial Bunny Defender: https://github.com/eiffelqiu/bunny-defender 


I had done the index.html, boot.js, preloader.js and am currently at StartMenu.js, where when i run on localhost, is supposed to show a preload/splash screen, and arrive at the game's startmenu. 


However, it get stuck at the preload screen and in Console, it states - Uncaught TypeError: Cannot read property 'texture' of undefined, where when dig further, it shows something is wrong with this line in my StartMenu.js:

this.startPrompt = 
this.add.bitmapText(this.world.centerX-155, this.world.centerY, 'eightbitwonder', 'Touch to Start!', 24);


Can any experts here advise what's wrong so I can move forward with this tutorial? I am using the current version 2.4.4, and am following everything strictly with the tutorial so far and cant seem to figure out whats wrong, except i am thinking maybe due to the version of Phaser we are using are different (tutorial is using v2.0.4 "Mos Shirare").


Thank you!

Link to comment
Share on other sites

Hi, thanks for your reply. The below shows my code in Preloader.js where i load the fonts. Is there anything which i should change?


BunnyDefender.Preloader = function(game){
this.preloadBar = null; //initially preloadBar and titleText will be null, cos nothing yet
this,titleText = null;
this.ready = false; // game not yet ready, so boolean will be set to false
//spec out our Phaser functions for preloader
BunnyDefender.Preloader.prototype = {
preload: function(){
this.preloadBar = this.add.sprite(this.world.centerX, this.world.centerY, 'preloadBar');
// sets the transform point(anchor point) to center of the object
this.preloadBar.anchor.setTo(0.5, 0.5);
this.titleText = this.add.image(this.world.centerX, this.world.centerY-220, 'titleimage');
this.titleText.anchor.setTo(0.5, 0.5);
this.load.image('titlescreen', 'assets/images/TitleBG.png');
// load bitmap fonts, the actual font spritesheet of .png, plus bind this to the font's data element (.fnt)
this.load.bitmapFont('eightbitwonder', 'assets/fonts/eightbitwonder.png', 'assets/fonts/eightbitwonder.fnt'); 
create: function(){
// after setPreloadSprite have finished loading the preloadBar, we no need to crop the preloadBar image anymore
this.preloadBar.cropEnabled = false;
update: function(){
// when comes to this step, we know our game is loaded n ready to run. Can set the game ready to true.
this.ready = true;
Link to comment
Share on other sites

The only issue I see is the typo where you have , instead of a . on the second line of the constructor sorry (I suspect the typo probably isn't breaking much)

Could you font be missing some of the characters in the text you are asking Phaser to render? Maybe try without the punctuation or all uppercase or all lowercase and see if any of these work...

Link to comment
Share on other sites


  • Recently Browsing   0 members

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