TextArea Word Wrap Rendering Errors (4.20)

[endorph]

I've recently updated our application from 4.18 to 4.20, and I've noticed a couple of rendering errors with TextArea. They occur when setWideTextAction() is set to WIDE_TEXT_WORDWRAP, and the text area wraps.

The first problem is related to multi-line text areas. When calculating the bounding box for rendering, it only considers with width of the first line. If the second line is longer than the first, it is truncated. This has already been reported (search for "touchgfx truncated line when using word wrapping"), but there's no resolution there. Regenerating the project does not help me.

I've done some investigation, and the issue appears to be in TextArea::calculateBoundingBox. It correctly calculates the height of the bounding box, but the width is set to the first line of text only. If the second line is longer, it gets truncated when rendering.

I've looked at the code in TextArea.cpp; specifically, this section (lines 266-277):

do
{
 wtis.getStringLengthForLine(lineHeight * 2 > widgetRectHeight);
 
 const uint16_t lineWidth = wtis.getLineWidth();
 if (width < lineWidth)
 {
 width = lineWidth;
 }
 numOfLines++;
 widgetRectHeight -= lineHeight;
} while (wtis.getCurrChar() != 0 && widgetRectHeight > lineHeight);

The issue is related to widgetRectHeight > lineHeight on the last line. I think it's causing an early exit from the loop after the first line. If I remove this condition, the problem is resolved, but I don't know if that's a proper fix, because I haven't checked what that logic is trying to do. As a guess, maybe widgetRectHeight is the height before it's resized to fit multiple lines, and so it's only considering the single line that is visible before resizetHeightToCurrentText() is called?

I hope that provides some pointers to the resolution; I'm not familiar with this code, so I could be very wrong.

Note that this issue does not occur for the TextAreaWith*Wildcard versions; I think this is because their ::draw() function ignores the bounding box, and redraws the entire area every time.

The second problem relates to TextAreaWithOneWildcard, when rendering centered text, with word wrap enabled. Under these conditions, the text renders left-aligned, not centered. This does not occur with a standard TextArea; I have not checked TextAreaWithTwoWildcards.

I have not investigated this in detail yet, but I will report if I find anything.

Thanks.

[Yoann KLEIN]

Hello @endorph​ ,

Thanks for reporting issues, that is very helpful !

I managed to reproduce the first problem, I will inform my colleagues about it.

But for the second issue, I didn't succeed on reproducing it yet. In my project, the TextAreaWithOneWildcard is correctly centered on the display.

Could you please share screenshots of the issue ?

Thank you,

/Yoann

[endorph]

Sure, here's some more information:

My code setup is loosely:

// In the project .touchgfx file:
{
 "Type": "TextArea",
 "Name": "t",
 "X": 5,
 "Y": 156,
 "Width": 173,
 "Height": 29,
 "Visible": false,
 "TextId": "__SingleUse_NFOR", 
 "TextRotation": "0",
 "Wildcard1": {
 "TextId": "__SingleUse_F9FS",
 "UseBuffer": true,
 "BufferSize": 3
 }
},
 
// Texts and typographies:
// __SingleUse_NFOR is "Custom <>", Alignment = Center
// __SingleUse_F9FS is "8", Alignment = Center
// Typography is Font="RobotoCondensed-Bold.ttf" Size="24" Bpp="4" Direction="LTR" FallbackCharacter="?" WildcardCharacters="-" WildcardCharacterRanges="0-9"
 
// In the <Class>Base.cpp
touchgfx::TextAreaWithOneWildcard t;
 
// In <Class>::initialize() function
t.setWideTextAction(touchgfx::WIDE_TEXT_WORDWRAP);
t.resizeHeightToCurrentText();
t.invalidate();
 
// In <Class>::display() function:
int customValue = 1;
Unicode::snprintf(tBuffer, T_SIZE, "%d", customValue);
t.setVisible(true);

I get this: It's a white background, so it's hard to see, sorry.

If I comment out the setWideTextAction call, I get this:

 

From my debugging, the alignment is correctly set to center when TextAreaWithWildcardBase::draw calls LCD::drawString. I can't debug inside there due to lack of source code. We're using a LCD16bpp, if that's relevant. This testing is via a host simulator, not on the target.

[Yoann KLEIN]

Hello,

Sorry for the huge delay.

Since we resolved that internally together, I'll answer and close this post so other people can find a fix if they meet a similar issue.

This issue was fixed in TouchGFX 4.21.0.

If you still want to use 4.20.0, you can still fix the bug manually :

• Navigate to touchgfx/framework/source/widgets/TextArea.cpp file.
• Copy-paste this file to your gui/src/ folder, for example in gui/src/common/.

• Open the file and replace line 277 :

Replace

while (wtis.getCurrChar() != 0 && widgetRectHeight > lineHeight);

With

while (wtis.getCurrChar() != 0 && widgetRectHeight >= lineHeight);

• Generate code
• The bug should be fixed.

/Yoann