Csharpnewbie
Csharpnewbie

Reputation: 77

TextWrap in StackPanel

I have a UserControl which a couple of buttons and some Textblock's. For some reason, the TextWrap is not working for this Textblock.

  <StackPanel Grid.Column="0" Margin="0 0 0 10">
        <TextBlock  FontWeight="DemiBold" Text="Account closure" x:Name="Message" 
               Margin="0 6 0 2"
               FontSize="18" />
        <StackPanel Orientation="Horizontal"  >
            <TextBlock   Text="A random text here, here, here " 
                    Margin="0 6 0 0"
                    FontSize="18" />
            <TextBlock   Text="AZEQSD"
                         Margin="0 6 0 0"
                      TextWrapping="Wrap"  FontWeight="DemiBold" FontSize="18" />
        </StackPanel>
    </StackPanel>

The output (The selected part = second StackPanel) while the part where I have the mouse = the second textblock with the TextWrapping property set to Wrap.

See here

enter image description here

Upvotes: 5

Views: 523

Answers (2)

Magnetron
Magnetron

Reputation: 8543

A DockPanel adjust better with this kind os situation:

<StackPanel Grid.Column="0" Margin="0 0 0 10">
    <TextBlock  FontWeight="DemiBold" Text="Account closure" x:Name="Message" 
           Margin="0 6 0 2"
           FontSize="18" />
    <DockPanel>
        <TextBlock DockPanel.Dock="Left"  Text="A random text here, here, here " 
                Margin="0 6 0 0"
                FontSize="18" />
        <TextBlock   Text="AZEQSD"
                     Margin="0 6 0 0"
                  TextWrapping="Wrap"  FontWeight="DemiBold" FontSize="18" />
    </DockPanel>
</StackPanel>

Edit:

Quoting BradleyDotNET's comment:

This works because DockPanel will constrain the last child to the remaining space, and it fills its container which is the stack panel that is constrained to the Grid.

Edit2:

You can have te whole second textblock wrap to the next line using a WrapPanel:

<StackPanel Grid.Column="0" Margin="0 0 0 10">
    <TextBlock  FontWeight="DemiBold" Text="Account closure" x:Name="Message" 
           Margin="0 6 0 2"
           FontSize="18" />
    <WrapPanel>
        <TextBlock DockPanel.Dock="Left"  Text="A random text here, here, here " 
                Margin="0 6 0 0"
                FontSize="18" />
        <TextBlock   Text="AZEQSD"
                     Margin="0 6 0 0"
                  TextWrapping="Wrap"  FontWeight="DemiBold" FontSize="18" />
    </WrapPanel>
</StackPanel>

Upvotes: 3

BradleyDotNET
BradleyDotNET

Reputation: 61339

StackPanel sizes to fit its contents unless it is actually given a size. So, in the "basic" case, word wrapping doesn't work as you show.

The TextBlock in the "main" StackPanel will have wrapping work because its width is constrained by using Grid.Column. The nested StackPanel has no such restriction. The easiest thing would be to put the second stack panel in the main grid (row 1, column 0) so it is also constrained; though there are a number of other possibilities.

Upvotes: 4

Related Questions