Jump to content

layout, wordwrap and label nightmare

Recommended Posts

I am having a number of issues with w3labels and correct wrapping of text.

1. When using a layout wordwrap is not obeyed- text disappears off to the side.
2. Wordwrap does work correctly in a normal non-layout formatted label - chopping off text top and bottom

Changing wordwrap and autosize properties does not solve the issues.


You can see in the picture the layout version along the top (above the button) and a normal label not in the layout below the button.

In the top label the sentence is cut off at ... the sessions your children will be absent for:" (in italics is missing).

In the bottom label the wordwrap does not result in sufficient height.



No custom css or non-standard settings just opened a new Visual Component Project

internal browser set to limited width - e.g., (480x800)







Link to post
Share on other sites

@warleyalex thanks for the project. 

I tried it on my own project and it didn't work as expected. I figure dout that if the caption is set in onactivate then the resize does not change the height of the label correctly.

procedure TForm1.Form1Activate(Sender: TObject);

  Label1.Caption := '<b>Today''s date '+FormatDateTime('dddd d of mmmm yyyy', now)
  +'</b><br>Here are your upcoming booked sessions. Please select the sessions your children will be absent for:<br>MOre writing.';

  Label2.Caption := Label1.Caption;

Then you end up with the image attached


So there are two issues -

1,  tw3label and the clipping 

2  How do we get the label height to be recalculated if caption set in "activate", or even within the "resize" procedure.






Link to post
Share on other sites
  • Administrators

All right, you seem to have both AutoSize and WordWrap on in the top label. So basically, we have a conflict situation: The layout should resize the label width according to the form size but you also want the label width to match the caption. Reading TW3Label code, SetWidth and SetHeight are ignored if AutoSize is true, so basically the layout does not get to set the label size at all and the width is only determined by the content.

The second label has AutoSize off, which explains why it's not being resized.

Now, I wonder how this should be tackled. Is this what should happen in this particular case:

  1. Layout sets label width
  2. Text is wrapped
  3. Label height is AutoSized (but not label width)
Link to post
Share on other sites

Hi @jarto,  I have tried all the permutations, autosize on/off and wordwrap on/off and the label doesn't behave nicely.


With a label and Tlayout, I would have thought that the layout determines the width of the label and the label's content would determine the height if wordwrap is true.


As a normal label (not using tlayout), if autosize is false and Wordwrap:=true then the the height of the label should increase within the provided width so that the content fits.





Link to post
Share on other sites
  • Administrators

Controls currently have no information about how they are resized or moved. They don't know that the layout is controlling it. It is possible to add a flag for that if it is beneficial. However, in this case I believe that it's easiest to just change how Autosize works:

  • AutoSize True
    • Resize width based on content. Resizing happens before WordWrap.
    • Resize height based on content.
  • AutoSize False
    • Width comes from the control itself. Layout sets it in this example we've been handling.
    • If WordWrap True, content is split into lines.
    • If height is too small, it's increased.
Link to post
Share on other sites
  • Administrators

Update: I've been running some tests. It's a bit dangerous to dynamically increase the label height when AutoSize is false.

In the meantime, maybe you should try simply using a TW3DivHtmlElement where you do not specify height at all? You need to create the control in code and then set InnerText (or InnerHtml if you want to use html tags). When no height is set, the browser automatically resizes the height according to the content.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...