tonyw

How to win at PIXI.extras.BitmapText ?

Recommended Posts

hi,

I'm trying to get bitmap fonts working, with little success. Now, the font that the pixi example uses, does work, e.g. -

https://github.com/pixijs/examples/blob/gh-pages/required/assets/desyrel.xml demo page - http://pixijs.github.io/examples/#/demos/text-demo.js

Bit whatever I output myself, from https://www.bmglyph.com/ as recommended here - http://pixijs.download/release/docs/PIXI.extras.BitmapText.html - does not work, failing with - 

TypeError: undefined is not an object (evaluating 'BitmapText.fonts[this._font.name].size')

So, I'm wondering, what exactly did they output the example font, desyrel.xml, from? I'm using the Mac exporter that they recommend. Maybe that actually doesn't work, and only the windows exporter works?

Um, kinda stuck. Any ideas? 

thanks, Tony

Share this post


Link to post
Share on other sites
4 hours ago, alex_h said:

There's an online bitmap font tool made in flash that is a bit easier to use

http://kvazars.com/littera/

you could give that a try?

bmglyph is easy to use, but its output doesn't work ;) I might report this to pixi as their instructions are wrong.

But littera does work! Yay. Thanks for the link :)  

Share this post


Link to post
Share on other sites

I couldn't get bitmaps to work. I always got errors like `Uncaught Error: Texture Error: frame does not fit inside the base Texture dimensions: X: 54 + 0 = 54 > 1 and Y: 50 + 0 = 50 > 1`

I'm using the Arial  font (really simple). I'm using http://kvazars.com/littera/

  • I tried Pack Method 1 through 7
  • I tried just digits, just lowercase etc.
  • I tried different paddings
  • I tried different fontsizes
  • I tried different strokes
  • I tried different canvas sizes
  • I tried the same with bmglyph 

But none seem to work, what am I missing? 

Share this post


Link to post
Share on other sites
2 hours ago, adammarcwilliams said:

I had some similar problems with this yesterday so I wrote up the workflow I found to work step by step.

Hope this helps anyone else who finds this thread in the future.

https://www.adammarcwilliams.co.uk/creating-bitmap-text-pixi/

Added to https://github.com/pixijs/pixi.js/wiki/v4-Resources , and i'll ask owner of pixi-awesome to add there too

If you post it as separate thread, i'll pin it

Share this post


Link to post
Share on other sites
On 3/1/2019 at 9:52 AM, adammarcwilliams said:

I had some similar problems with this yesterday so I wrote up the workflow I found to work step by step.

Hope this helps anyone else who finds this thread in the future.

https://www.adammarcwilliams.co.uk/creating-bitmap-text-pixi/

Thank you Adam! Would you be willing to share some example code of a barebones working example (if it's easy)?

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.