WPF- Cut-off issue in WrapPanel

Question

when i use more than one controls inside the wrap Panel if any control contains lengthy text (more than the window size) cut-off is happening. (See the image)

I have two textblocks and one button control.

  <Grid>
        <WrapPanel>
            <TextBlock Text="Very long Text Message contains long text for testing " FontWeight="Bold"></TextBlock>
            <Button Content="sample Text"></Button>
            <TextBlock Text="sample Text  textblock"></TextBlock>

        </WrapPanel>
    </Grid>

the cut-off happens for first text block. i want wrap to next line if the text contains more characters.

help me to solve the issue. thanks in advance.

Answer 1

You need the attribute TextWrapping="Wrap" in your textbox

<TextBlock 
   Text="Very long Text Message contains long text for testing " 
   FontWeight="Bold"   
   TextWrapping="Wrap">
</TextBlock>

Answer 2

Are you trying to make a single paragraph that wraps? If so, then WrapPanel isn't actually what you want.

WrapPanel takes UI elements (rectangular chunks of real estate) and lays them out left-to-right, top-to-bottom. You could enable wrapping in your first TextBlock, but then it'll take up a rectangle of screen space that's two lines high. Because the TextBlock fills that entire rectangle, the button will actually appear under it, rather than to the right of the bold words "for testing ".

If you want to make the whole thing flow like a paragraph, you don't want to use UI elements (which are always rectangular chunks); you want to use text elements (which flow in paragraphs).

The way to get text elements into your XAML is to wrap them in a TextBlock. Try this:

<Grid>
    <TextBlock TextWrapping="Wrap">
        <Bold>
            <Run Text="Very long Text Message contains long text for testing " />
        </Bold>
        <Button Content="sample Text"></Button>
        sample Text  textblock
    </TextBlock>
</Grid>

Note that I wrapped the first chunk of text in a <Run> element -- otherwise the trailing space would be ignored (assumed to be whitespace in your XAML document). The second chunk of text didn't have leading or trailing spaces, so I just put it directly inline.

This answer has a bit more about the difference between the "controls" and "text" sides of XAML.