javascriptpixi.js

How to get wordWrap to work in PIXIjs BitmapText

Objective

We are trying to get wordWrap to work with PIXIjs (v3) PIXI.extras.BitmapText, but we can't get it to work in the same way that is does for standard Text.

Desired output: [Wrapped text as expected]

var someText = new window.PIXI.Text('blah blah blah',
                {
                    font: '32px Arial',
                    fill: 0x939393,
                    align: 'center',
                    wordWrap: true,
                    wordWrapWidth: me.width * (0.9 / window.devicePixelRatio)
                });

Issue: [Did not wrap text as expected] 

var someOtherText = new window.PIXI.BitmapText('blah blah blah',
                {
                    font: 'santana-grey-20',
                    align: 'center',
                    wordWrap: true,
                    wordWrapWidth: me.width * (0.9 / window.devicePixelRatio)
                });

Has anyone done this before or have any suggestions as to what to try?

Solution

  • Unlike PIXI.Text, PIXI BitmapText has no built-in support for word wrapping.

    You're only alternative is to split the text into multiple PIXI BitmapTexts.