phaser3-rex-notes
phaser3-rex-notes copied to clipboard
Wrapping issues when setting wrap mode to `word` or `character` in BBCodeText.TextStyle
As always your plugins are a super amazing addition to Phaser! Thanks again for all the hard work.
I noticed a couple bugs related to word wrapping and BBCodeText.
In our project we have an autoscaling text component which uses BBCodeText internally and when autoscale
is enabled it will attempt to fit the text to the bounds of the component so the text fills up the entire space.
This works fine as long as wrap is none but when wrap is word
or character
then there are two different bugs that occur.
I included screen shots of the good case, and then issues I see with word and with character along with the text that was attempted to be rendered.
Good case: Wrap is none
. Note that I inserted a \n
between each word manually just to demonstrate what desired wrapping could look like
- When wrap is
word
Most of the time this works but occasionally we see a) The word can get cut off at the end b) The word can be really small (seems the text width is not measured correctly?). c) The word can wrap at character boundaries
- When wrap is
character
I noticed that the character wrap will split multi character emojis which will break them.
For word wrap mode
a) The word can get cut off at the end
Once length of a word is larger then wrap length, BBCodeText will output this word with cut off result.
b) The word can be really small (seems the text width is not measured correctly?).
Can't get it in your image. I guess that, length of this word plus next word is larger then the wrap length, so BBCodeText put next word as first word of next line.
For character mode
I noticed that the character wrap will split multi character emojis which will break them.
emojis is multiple characters like :)
(2 characters) in plain string, so emojis might be wrapped into multiple lines.
Thanks for the quick reply.
The word wrap issues could entirely be due to how we are autoscaling. I was just surprised since we are setting the font size and checking if the resulting text is too wide and reducing the font size as a result. So maybe what is happening is that the text is getting cut off but is technically narrower than the desired width and so the auto scaling algorithm terminated.
For the character mode, I would expect that the wrapping algorithm would treat a emoji unicode character as a single character and not split it in the middle. Otherwise you can't use emojis with character wrapping.
I'll look at alternative approach to how we do autoscaling!
I guess though it is weird that in some cases with word
wrap the text is cut off and other times it is wrapped at a character boundary (i.e. not a space) to the next line.
Thanks for the quick reply.
The word wrap issues could entirely be due to how we are autoscaling. I was just surprised since we are setting the font size and checking if the resulting text is too wide and reducing the font size as a result. So maybe what is happening is that the text is getting cut off but is technically narrower than the desired width and so the auto scaling algorithm terminated.
I can try to expose a flag if wrapping output a cut-off word. Add to TODO.
For the character mode, I would expect that the wrapping algorithm would treat a emoji unicode character as a single character and not split it in the middle. Otherwise you can't use emojis with character wrapping.
I'll look at alternative approach to how we do autoscaling!
emoji might not be unicode character, as my example at previous post :)
are 2 characters, none of them is unicode, BBCodeText can't recognize these 2 characters as an emoji during wrapping the plain string.
I apologize, too-longer-word will be wrapping, see this demo, the 2nd text object at left side. The word loooooonnnnngggeeeerrr
has been wrapped into 2 lines.
Ah thanks for the follow up and demo! I think I understand the issue now in both the word and character cases.
For the word case at some point it has to be wrapped at the character level because the word is too wide. For the character (emoji) case it is hard to tell if a character is part of an emoji sequence without the help of external library that does that effort.
So in what cases will a word be simply cut off instead of wrapping at a character boundary when wrap is equal to word
?
I think word won't be cut of in latest version of BBCodeText. Could you provide a simplest test code for reproducing this case?
I'll try updating first and if I can still reproduce I'll try to create a simple example.