NativeUI: Colour control characters causing bias in string width evaluation.

If you have the strings “This is a yellow string” and “This is a ~y~yellow string”, the width is being evaluated taking into account the colour control characters. The consequence of this is text wrapping when there is sufficient space left to display the wrapped words.

To see an example of this, create a UIMenuItem with the following properties.

new UIMenuItem("Some text", "~w~Type: ~y~Off-Road, ~w~Difficulty: ~y~Professional")

and another with these

new UIMenuItem("Some text", "Type: ~y~Off-Road, ~w~Difficulty: ~y~Professional")

Even though the visible textual content is identical, the top one will force the word Professional onto the second line, whereas the second one will leave everything on one line. The second one is fine if you want the first word to be white but it fails if you don’t.

Ideally, upon creation of any menu item subtitle, the string needs to be passed through a control code removal function before being passed to the string width checking and then the width of that processed string storing as a value in the class. That way, the only additional processing that occurs is at creation time, which won’t impact on performance… plus you get accurately wrapped coloured strings. There is an ideal Dictionary based solution on this page: https://stackoverflow.com/questions/1321331/replace-multiple-string-elements-in-c-sharp

You can see an example of how this affects presentation in this image. The amount of space in the top box makes it look really bad.