TouchGFX fonts special textarea with auto convert proportional to monospaced?

[MM..1]

Hi all, i search properties for manage showed multinumber counters without not cool moving.

For example num 123 121 111 . Align not help here .

My idea is mark textarea as number aligned and render calculate widths from font for 0-9 and use it to convert showing as monospaced . 

Ofcourse font editor can change this , but better is switchable choice. Exist or is this doable in an TGFX version?

[GaetanGodart]

Hello @MM..1 ,

You could directly use a monospaced font, this way you don't even have to mana the spacing of your characters.
This is also the preferred way of doing it because if you make a trip to add space when needed on a non monospaced font, it will look weird as a "i" will have a lot of space around it.

However, if you still want to do a trick, I see 2 ways of doing it:

1. add multiple textAreas with only 1 character every time and that are spaced by the space you want for your characters then add code to control each of these textArea independently. This is ok when you know how many characters you will need
2. make a more complex project (perhaps a custom container) also with multiple textAreas where the spacing of the textAreas is set by code and perhaps where the number of textArea visible depends on the size of your desired text. This could be a solution if you often require this feature in your projects.

Overall I would recommend to simply use a monospaced font in a regular textArea.

If you share the design you want to achieve, maybe we can find a simple work around.

Regards,

[MM..1]

Sorry , but you maybe never create GUI and use fonts. Normal way is graphics designer choice font and programmer apply it. But in real world most good design is proportional !

Maybe you missunderstand i ask about number characters only . 0 1 2 3 4 5 6 7 8 9

But for universal use i dont see trouble create func as textArea2.setMonoWidth(20);...

Now API have for example textArea2.setIndentation(20); 

[Flemming Gram CHRISTENSEN]

Hello. 
There is no API to control the spacing of characters. TouchGFX will use the spacing in the font.
And you are right, the font is often selected by a designer person.

One option is to modify the font to use same spacing for all characters.

Second option is to use multiple TextAreas. Maybe also not pratical, but would work

A third option is to modify the output of the font converter. For the numbers, this is not difficult.

Here is an example:

I used the font Comic Sans MS in size 150.
We can easily see that the '1' are narrower than the '0'.

This can also be seen in the generated output. Take a look in the file generated/fonts/src/Table_comic_150_4bpp.cpp:

This table describes the width, height and other properties of the letters in the bitmap font.
The second number is the unicode. The 7'th number is the advance. This is the number of pixels that the "cursor-position" in moved after drawing the letter. We see that unicode 0x0031 = '1' is has an advance of 68 pixels, whereas the other number have advance=92.

If I modify 68 -> 92 I get this screen in the simulator (Designer still uses the TrueType file):

I you go this way, I suggest to create a patch file to do this modification, as the font converter will overwrite this file if you use new letters in this font.
I advice against modifying the generated files in general!

But so far best hack this week.

[MM..1]

Thanks Flemm, i ask this as requested feature in next versions , create workarounds is next dev time.

I know many ways to handle this ugly ... Your solution isnt design ok , because not only advance is required , but divide advance diff on left and right side to center char in monospace place.

[Flemming Gram CHRISTENSEN]

The number before the advance is the left indent.

Adding 12 here moves the '1' to the center of the letter box:

Changes this:

to

I hope it is useful.

Thanks!