CocoonJS + ttf fonts

[doyouknowyou]

Im using @fontface to use .ttf fonts in phaser, however the app is hard crashing at startup with Cocoon using Canvas+. Webview+ works, but is really laggy so I want to avoid. 

 

In the style tag:

 

 @font-face { font-family: 'Munro'; src: url('fonts/Munro.ttf');}

and an example of my text:

 

scoreText = game.add.text(36, buttonY,'' + score, { font: '28px Munro', fill: 'white'});

Cocoon supports fontface, so I'm unsure what could be causing the problem. Does anyone know how to fix, or has had similar problems?

 

 

Thanks!

[Sam]

using cocoonJS + ttf, works perfectly fine on many project.

first be sure you are using the original font name, which the font is set to

@font-face { font-family: 'fontUseName'; src: url('fonts/fontname.ttf'); }

looks like you have set this alright.

be sure that you store your font into the ./fonts folder. You have set this alright too.

3. Here is the code which I use to set the font. works perfectly_
( written the long way for better understanding ).
 

this.menuTextPLAY = this.game.add.text(x, y, "TEXT");                    this.menuTextPLAY.font = "BPdots";                    this.menuTextPLAY.fontSize = 30 * pixelratio + "px";                    this.menuTextPLAY.fill ="#ffffff";                    this.menuTextPLAY.x = game.width / 2 - this.menuTextPLAY.width / 2;                    this.menuTextPLAY.y = game.height - 200 * pixelratio;                    this.menuTextPLAY.setText('Play');

Works at 60FPS with physics, collisions, 50 sprites on canvas+ mode
( okay maybe more sprite - but thats basically what happens at the same time in my code )


The only thing which crashes cocoonJS on my machine with a black screen over more than 5 minutes was using WEBGL.
I don't know why or how or what happened. But since WEBGL is very slow on iOS using CocoonJS I use Canvas+ 
never had such a problem.

hope that helps anyway.

regards

[doyouknowyou]

Thank you so much!

 

Looks like setting it out like: 

this.menuTextPLAY = this.game.add.text(x, y, "TEXT");this.menuTextPLAY.font = "BPdots";this.menuTextPLAY.fontSize = 30 * pixelratio + "px";

Rather than inline like I did fixed the problem. Thanks again!

[Sam]

You are welcome