rexUI BBCodeText and TextArea isOverflow wrong calculation

Phaser 3
1

Hi there,

im start using the BBCodeText feature from rexUI plugin and get some problems with the “isOverflow” calculation.
It seems the the “linebreak” calculation is something “wired” in bb code.
For Phaser.Text is used the option for advancewordwrap.
For BBCodeText is try “char” and “word”, but each time same behavior.
The text itself is “normal” text without any linebreaks, bbcode or stylings… Its using the same global font settings.

see this:
(the red square was added via paint to show the boundings from the text-area)
rexUI_BBCodeText_overflow

Any idea how to fix this?
:slight_smile:
Greetings!

2

Please provide a simplest, runnable test code, to reproduce this issue.

3

Sorry.
I missed this :slight_smile:
Here u go:
https://jsfiddle.net/ragesoft/cug8ore7/

4

Your assumption about wrapping of BBCodeText is correct. BBCodeText does not support useAdvancedWrap yet, i.e. the wrapping result won’t be equal to useAdvancedWrap enable.
Will add this feature suggestion into TODO.

5

Thx. Sounds great.
But its Not only the advancedwordwrap, but the wrong height calculation in current function it seems.
U See the additional line break after the “looongg” Word?
Seems like some double break Problem…
Dono where this happens in Code.

6

I see, I will compare the case of useAdvancedWrap is false.

Edit:
Here are wrapping result of

  • Left useAdvancedWrap is false of Text
  • Right BBCodtText

圖片

The extra new line are from inconsistent wrapping logic.

7

Text wrapping issue has been fixed at latest minify file.

This is a snapshot of useAdvancedWrap: false case :

圖片
圖片540×565 105 KB

8

That was fast.
I’ve updated the code with a new “longer” word.
See the “cut off” at the end of the second word “er”?

So in this current version, the “linebreak” is fixed, but the “break inside word” is not. :slight_smile:

But thx so far! u are awesome!

9

How about setting mode: 'char' in style config of BBCodeText?

10

Thats no option / solution in this case, because so it will also break “short” words on end of line and dont break whole word to new line :slight_smile: That dosnt looks good.

11

I see, so the statement is – char-wrapping only for the word which the width is larger than line width?

12

Now word-break to lines if width of this word is larger than line width, see demo

13

That looks so good. 1000x thx. I will try it in my game. But i depend on npm package to be Update becuz i use webpack to build my ressources. :slight_smile: so i will wait for got push.