Search the Community

Showing results for tags 'ttf'.

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 5 results

  1. I'm trying to build a native app with cocoon and canvas+ and have some trouble with the fonts. Everything works fine when running the game in a normal browser or in cocoon webview+. But in canvas+ mode, all text renders really small and pixelated. The code for the text: this.scoreText =, pos.y, "0", { font: "18px Arial", fontWeight: 'bold', fill: "#FFFFFF" }); this.scoreText.anchor.setTo(0.5, 0); I don't reference a .ttf or anything. Do I explicitly need to include an Arial font for it to work in canvas+ mode?
  2. GBear

    can i load TTF?

    Hi.. how can use True type Font in pixi.js? can you give me any tips? thx everyone!!
  3. Hi, I am trying to set an external font (ttf) to a phaser text for the whole weekend but the font is not changing. I am also attaching the project structure. Can someone please give some idea or suggestions on this issue. Thanks I did the below steps. Step 1: Convert the ttf font to web font using some online tool. Step 2: Add the below contents to a external css file and insert it inside the index.html @font-face { font-family: 'tamil-bibleplain'; src: url('../fonts/tamil-bible-webfont.eot'); src: url('../fonts/tamil-bible-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/tamil-bible-webfont.woff') format('woff'), url('../fonts/tamil-bible-webfont.ttf') format('truetype'), url('../fonts/tamil-bible-webfont.svg#tamil-bibleplain') format('svg'); font-weight: normal; font-style: normal; } Step 3: Inside the font directory iI add the below 4 files. tamil-bible-webfont.eot tamil-bible-webfont.svg tamil-bible-webfont.tff tamil-bible-webfont.woff Step 4:Add the font to the text in the js file as below var titleText =, 5, "Jump & Go!", {font: '20px tamil-bibleplain', fill: '#000'}); titleText.stroke = "#00AAAA"; titleText.strokeThickness = 6; titleText.setShadow(2, 2, "#333333", 2, true, false); titleText.font = 'tamil-bibleplain'; This is the project structure.
  4. Hi guys, Started using phaser recently for a game I am making. The only thing is, I'm trying to use a different (custom) font, something like this: Unfortunately I cannot get the font to work. I have two font files - a .png file and a .xml file (xml with config) generated by the 'littera' font generator from a .ttf file. Here is a demo I threw together to demonstrate my issue. var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { create: create , preload: preload});function preload() { // Load the font game.load.bitmapFont('Pixel','assets/pixel.png', 'assets/pixel.xml');}function create() { // Add a one second delay so that the font can load properly, doSomething, this);}function doSomething() { // Render the text var text = "- phaser -\n with a sprinkle of \n pixi dust."; var style = { font: "65px Pixel", fill: "#ff0044", align: "center" }; var t = game.add.text(, 0, text, style);}Any help appreciated, I'm sure I'm being really stupid but it's quite important to have the right font. I have attached the font files so that you can test the font with your solution if you want. Thanks, Matthew pixel.xml
  5. Phaser ver 2.0.3-2.0.4 ____________________________________________________________________________________________________________ NOT SOLVED YET ____________________________________________________________________________________________________________ Firstly, I'd like to ask whether bitmap fonts are faster than webfonts when rendering with strokes. ____________________________________________________________________________________________________________ QUESTION IS SOLVED ____________________________________________________________________________________________________________ Secondly, I cannot load my bitmap font. I've tried and FontBuilder for generating the xml and atlas (also converted *.fnt to *.xml) but Phaser keeps saying that error on adding that damn font when I'm trying to place it on the scene: Uncaught TypeError: Cannot read property 'size' of undefined phaser.js:2806 PIXI.BitmapText.updateTextphaser.js:2806 PIXI.BitmapTextphaser.js:2749 Phaser.BitmapTextphaser.js:31321 Phaser.GameObjectFactory.bitmapTextphaser.js:26296 SetupGUIpopulo.js:93 StartGameplaypopulo.js:290 mainmain.js:79 Preloader.createpreloader.js:146 Phaser.StateManager.loadCompletephaser.js:14388 Phaser.SignalBinding.executephaser.js:15296 Phaser.Signal.dispatchphaser.js:15174 dispatchphaser.js:14941 Phaser.Loader.nextFilephaser.js:44211 Phaser.Loader.xmlLoadCompletephaser.js:44162 _xhr.onload That trouble almost stopped my development process. It is really annoying. I guess the font was not really loaded. But why there was no Phaser log error that says what is really wrong? I've found similar topics:,, but none of them contain the real solution that worked for me. ____________________________________________________________________________________________________________ Sorry for my stupidness, the second question is solved. I was adding the bitmapText with the different font key.