Gui Text not responsive

Bugs
1

This was working fine in 4.2 but not in 5.03. Text is not responsive.

2

cc @DarraghBurke would be great if you can have a look ?

5

So I found the root cause which is actually this bug fix: fix incorrect GUI.TextBlock width when resizeToFit is true & fontStyle is italic by Kalkut · Pull Request #11038 · BabylonJS/Babylon.js · GitHub We are now measuring text width accurately following this TextMetrics - Web APIs | MDN accounting for way more cases than before and also not including trimmed white spaces in.

In your case you add “padding” with spaces. Could you explain me more about your use case cause there might be a better approach to your problem ?

If you definitely need those empty spaces, I d suggest to play with offsets instead and I can help with the pseudo code for it ?

1 Like
7

I’m going to wait to see if there is a fix shortly with 5.1, 4.2 is working fine, and I can use an input statement if need be. But making my own input cursor gives me more control…https://playground.babylonjs.com/#8CDRSZ#34

8

Got it to work, things seem to be reversed in 5.2 compared to 4.2:
remove space:

4.2:
remove space:
IText.textHorizontalAlignment = Control.HORIZONTAL_ALIGNMENT_RIGHT;
let cursorText = "|          ";
cursorText = cursorText.slice(0, -2);
IText.text = cursorText;
or add space:
cursorText += "  ";
IText.text = cursorText;

5.2
remove space:
IText.textHorizontalAlignment = Control.HORIZONTAL_ALIGNMENT_LEFT;
let cursorText = "|";
 cursorText = "  " + cursorText;  //350
 IText.text = cursorText;
add space:
cursorText = cursorText.slice(2);  //409
IText.text = cursorText;

5.2
remove space:
IText.textHorizontalAlignment = Control.HORIZONTAL_ALIGNMENT_RIGHT;
let cursorText = "          |";
cursorText = cursorText.slice(2);
IText.text = cursorText;
or add space:
cursorText = "  " + cursorText;
IText.text = cursorText;

5.2