Search the Community

Showing results for tags 'phaser.text'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 7 results

  1. let width =; let height =; let startGameText = this.make.text(findGameButtonText).setOrigin(0.5, 0.5); let startGameButton = this.add.sprite(0, 0, 'ui-spritesheet-blue', 'blue_button00.png'); let startGameContainer = this.add.container(0, 0, [ startGameButton, startGameText ]); startGameContainer.setSize(190, 50).setInteractive(); let optionsText = this.make.text(menuOptionsButtonText).setOrigin(0.5, 0.5); let optionsButton = this.add.sprite(0, 0, 'ui-spritesheet-blue', 'blue_button00.png'); let optionsContainer = this.add.container(0 + 200, 0, [ optionsText, optionsButton ]); optionsContainer.setSize(190, 50).setInteractive(); let mainMenuButtons = this.add.container(width / 2, height / 2 + 200, [ startGameContainer, optionsContainer ]); mainMenuButtons.setSize(width, 50); Options for texts export const menuOptionsButtonText = { x: 0, y: 0, text: 'Options', style: { fontSize: '16px', fontFamily: 'Monospace', color: '#ffffff', align: 'center', shadow: { color: '#000000', fill: true, offsetX: 2, offsetY: 2, blur: 8 } } }; export const findGameButtonText = { x: 0, y: 0, text: 'Start game', style: { fontSize: '16px', fontFamily: 'Monospace', color: '#ffffff', align: 'center', shadow: { color: '#000000', fill: true, offsetX: 2, offsetY: 2, blur: 8 } } } I can not understand why the text "Options" is not displayed
  2. Hello, How can one overwrite property of object, what's the syntax? Object.defineProperty(Phaser.Text.prototype, 'text', { get: function() { return this._text; }, set: function(value) { if (value !== this._text) { this._text = value.toString() || ''; this.dirty = true; if (this.parent) { this.updateTransform(); } } } }); I would like to extend Phaser.Text, so I need to handle the moment when text is changed. Of course I can overwrite setText() method but what if by mistake in future I will access .text property? Thanks in advance
  3. Hi all! I am new on Phaser, just got it working with my FireLoop project. FireLoop generates Angular 2 project with Angular CLI. I made my own TypeScript game into that and it works just great, well almost. I have the following code in my project: /// <reference path="../../../node_modules/phaser/typescript/phaser.d.ts" /> import { SessionInterface, Session, FireLoopRef } from '../shared/sdk/models'; import { RealTime } from '../shared/sdk/services'; import { LoopBackConfig } from '../shared/sdk'; export class SimpleGame { session: Session; sessions: Session[] = new Array<Session>(); sessionRef : FireLoopRef<Session>; game: Phaser.Game; sessionsText: Phaser.Text; constructor(private rt: RealTime) { = new Phaser.Game(800, 600, Phaser.AUTO, 'content', { create: this.create }); this.rt.onReady().subscribe(() => { this.sessionRef = this.rt.FireLoop.ref<Session>(Session); this.sessionRef.on('change').subscribe((sessions: Session[]) => { this.sessions = sessions; this.updateText(); }); // this.sessionRef.stats().subscribe((stats: any) => console.log("stats:", stats)); }); this.rt.onDisconnect().subscribe((error: string) => { console.log('Disconnected', error); }); this.rt.onUnAuthorized().subscribe((error: string) => { console.log('UnAuthorized', error); }); this.rt.onAuthenticated().subscribe((error: string) => { console.log('Authenticated', error); }); } create() { let text = "Hello World!"; let headerStyle = { font: "65px Arial", fill: "#ff0000", align: "center" }; let textStyle = { font: "24px Arial", fill: "#ff0000", align: "center" };, 0, text, headerStyle); this.sessionsText =, 100, "Initializing...", textStyle); } updateText() { let sessionsString: string; if (this.sessions) { sessionsString = "Hosts: " + => + ", Clients: " + => session.client); console.log(sessionsString, this.sessionsText); this.sessionsText.setText(sessionsString); } } } The problem is with sessionText variable. When I console.log it right at the end of "create"-function, it seems to be proper object. Anyhow when I try to console.log it anywhere else, it is undefined. So, this setText line never works: this.sessionsText.setText(sessionsString); Instead, it gives an error. So, I guess it isn't saving the variable at the create like it's supposed to. Any solutions. Here's also a screenshot:
  4. Hello I use Phaser.text in my game. I want to align the text so I use text.anchor.set(0.5). On my small text it work fine but on my biggest text it make it blurry I read on forum to use text.anchor.x = Math.round(text.width * 0.5); but it only make my text disappear Is there an other way to do or maybe I'm doing it wrong question = game.add.text(310,180,questions[nbalea], {fontSize: '32px', fill: '#000' }); question.anchor.set(0.5); question.anchor.x = Math.round(question.width * 0.5); Thank you
  5. Hello. I'm new to Phaser and kind of new to javascript so please bear with me: I'm using this Es6 Phaser boilerplate and in there, there's a Phaser.Sprite extension called Mushroom: import Phaser from 'phaser' export default class extends Phaser.Sprite { constructor ({ game, x, y, asset }) { super(game, x, y, asset) = game this.anchor.setTo(0.5) } update () { this.angle += 1 } } So I tried to replicate this in the Phaser.Text Class like this: import Phaser from 'phaser' export default class extends Phaser.Text { constructor({game, x, y, text, style}){ super(game, x, y, text, style) = game this.anchor.setTo(0.5) } } and then called it on the Game.js file, just like in the example: this.texto = new Texto({ game: this, x: 0, y:0, text:"hola mundo" }) but this is the result: How can I properly extend Phaser.Text or create a reusable class? What am I doing wrong? Thanks!
  6. Here is the JSFiddle. I have two events. game.input.onDown which does some logic (generates particles in my example), where textButton is a Phaser.Text object instance, which does another logic.The problem is: when I click on my textButton both event are fired 1 and 2. The question is, how to prevent event 1 from firing when I click on the textButton? And why is it happen? Part of code: ... //This event is fired on click anywhere event # 1 game.input.onDown.add(particleBurst, this); //This is Clickable text textButton = game.add.text( - 5, 5, "CLICK ME", fontStyle); textButton.anchor.setTo(1, 0); textButton.inputEnabled = true; //This event is fired on click on text event # 2 () { console.log("button is Clicked"); }, this, 2); ...Any help is appreciated. How can I stop event propagation?
  7. Howdy all Does the Phaser.Text.destroy() method actually work? I'm testing in v2.0.7, and I've found that by adding a just a single Phaser.Text object, if I then restart current State many times, the memory skyrockets. Yes, I'm using a shutdown method, and I'm calling destroy and setting the phaser text object to null. But no dice. If I test the same code without creating the Phaser.Text object, the restart is fine, no crazy memory usage. I created a small test game that shows to bug reliably on my PC, can be seen here: Two options are available, you can start the Game State with or without a Phaser.Text object being created. The Game State then has a 5 second timer and will do a restart 10 times. Little bit of info in the Console Log. Testing in Firefox and checking its total memory usage: - Without Phaser.Text memory bounces between 350 to 450mb during the 10 restarts. - With Phaser.Text memory skyrockets to 2 gig after 10 restarts and never comes back down until the tab/window is closed. Once closed, GC eventually kicks in and the memory settles back down to 300mb. Before and after each test, I shutdown Firefox. During the test I only have the one tab open running the game. The Game State code is below. The creation of a Phaser.Text object is driven by the setting of boolean BasicGame.createText when the Game State is started from the MainMenu (MainMenu code not shown, can be seen in test app via debug). BasicGame.Game = function (game) { // When a State is added to Phaser it automatically has the following properties set on it, even if they already exist:; // a reference to the currently running game this.add; // used to add sprites, text, groups, etc; // a reference to the game camera this.cache; // the game cache this.input; // the global input manager (you can access this.input.keyboard, this.input.mouse, as well from it) this.load; // for preloading assets this.math; // lots of useful common math operations this.sound; // the sound manager - add a sound, play one, set-up markers, etc this.stage; // the game stage this.time; // the clock this.tweens; // the tween manager; // the game world this.particles; // the particle manager this.physics; // the physics manager this.rnd; // the repeatable random number generator // You can use any of these from any function within this State. // But do consider them as being 'reserved words', i.e. don't create a property for your own game called "world" or you'll over-write the world reference.};BasicGame.Game.prototype = { textStyle: null, phaserText: null, restartCounter: 0, create: function () {;;, true, true, true, false);; = 500; this.add.sprite(0, 0, 'gamepage'); //create a bunch of P2 boxes to cause lots of collisions and put a bit of load on the game this.boxes =; for (var i = 0; i <= 20; i++) { var box =, 100, 'box');; this.boxes.add(box); } this.textStyle = { font: "24px Verdana", fill: "#000000", align: "center", stroke: "#000000", strokeThickness: "2" }; if (BasicGame.createText) { this.phaserText =, 150, 'Phaser.Text', this.textStyle); } if (this.restartCounter < 10) { //do 10 timer based restarts * 5, this.restartFromTimer, this); } else { console.log('*** All timer based restarts completed ***'); } }, update: function () { }, restartFromTimer: function() { this.restartCounter++; console.log("*** Timed restart number: " + this.restartCounter); this.restartGame(); }, quitGame: function (pointer) { this.state.start('MainMenu'); }, restartGame: function (pointer) { this.state.restart(); }, shutdown: function() { console.log("Shutdown"); this.textStyle = null; if (this.phaserText != null) { console.log("phaserText destroy"); this.phaserText.destroy(); this.phaserText = null; } this.boxes.removeAll(); }};