Problem with retro fonts in a group

[_o0o_]

Hi I am having a problem when trying to use retrofont in a group: 
 

            console.log("Start of text guff");            // init the font and funk it up.            this.titlefont = new Phaser.RetroFont(this.game,'knightHawks', 31, 25, Phaser.RetroFont.TEXT_SET6, 10, 1, 1);            console.log("created retrofont");            this.frontLayer.add(this.titlefont);            console.log("before text loop");            // pretty sure this adds 18 lines of text with a random tint per line...            for (var c = 1; c < 19; c++)            {                var i: Phaser.Image = this.game.add.image(this.game.world.centerX, 6 + c * 32, this.titlefont);                i.tint = Math.random() * 0xFFFFFF;                i.anchor.set(0.5, 1);            }            console.log("after text loop");            // example use of font...            this.titlefont.text = "STARGAZER";            console.log("End of text guff");

results in the following in chrome's console:

 

titleState.ts:208 Start of text gufftitleState.ts:211 created retrofontphaser.js:982 Uncaught TypeError: child.setStageReference is not a functionPIXI.DisplayObjectContainer.addChildAt @ phaser.js:982PIXI.DisplayObjectContainer.addChild @ phaser.js:958Phaser.Group.add @ phaser.js:20393TitleState.create @ titleState.ts:212Phaser.StateManager.loadComplete @ phaser.js:18360Phaser.StateManager.preUpdate @ phaser.js:18127Phaser.Game.updateLogic @ phaser.js:26379Phaser.Game.update @ phaser.js:26327Phaser.RequestAnimationFrame.updateRAF @ phaser.js:44881Phaser.RequestAnimationFrame.start._onLoop @ phaser.js:44865

Can anyone shed some light on this for me?

 

Thanks _o0o_ x

 

[rich]

A RetroFont is a type of texture, not a display object in its own right. So you'd never add the font itself to a Group, you'd add the Image that uses the font as its texture.

[_o0o_]

I solved this, and wrapped it up in a function (typescript) only uses the font i am interested in but easy to change to plain JS and to fit your own needs.

        addText(text: string, x: number, y: number, scalex: number, scaley: number, tint?: number, ax?: number, ay?: number, group?: Phaser.Group): Phaser.Image {            var titlefont = new Phaser.RetroFont(this.game, 'knightHawks', 31, 25, Phaser.RetroFont.TEXT_SET6, 10, 1, 1);            titlefont.setText(text,true,null,10,Phaser.RetroFont.ALIGN_CENTER,false);            var i: Phaser.Image = this.game.add.image(x, y, titlefont, null, group);            tint = tint || 0xFFFFFF;            i.tint = tint;            scalex = scalex || 1;            scaley = scaley || 1;            i.scale.setTo(scalex, scaley);            i.anchor.set(ax, ay);            return i;        }