Force textblock to wrap in WPF listbox

Question

I have a WPF listbox which displays messages. It contains an avatar on the left side and the username and message stacked vertically to the right of the avatar. The layout is fine until the message text should word wrap, but instead I get a horizontal scroll bar on the listbox.

I've Googled and found solutions to similar issues, but none of them worked.

        <ListBox HorizontalContentAlignment="Stretch"  ItemsSource="{Binding Path=FriendsTimeline}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Border BorderBrush="DarkBlue" BorderThickness="3" CornerRadius="2" Margin="3" >
                            <Image Height="32" Width="32"  Source="{Binding Path=User.ProfileImageUrl}"/>
                        </Border>
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="{Binding Path=User.UserName}"/>
                            <TextBlock Text="{Binding Path=Text}" TextWrapping="WrapWithOverflow"/> <!-- This is the textblock I'm having issues with. -->
                        </StackPanel>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

Answer 1

The problem might not be located in the ListBox. The TextBlock won't wrap, if one of the parent controls provides enough space, so that it hasn't the need to wrap. This might be caused by a ScrollViewer control.

Answer 2

Contents of the Textblock can be wrapped using property "TextWrapping". Instead ofStackpanel,use Dockpanel/grid. One more thing - set "ScrollViewer.HorizontalScrollBarVisibility" to Hidden for the listbox.

Answer 3

The crappy thing is, when Vertical scrollbar comes up I have to even reduce the width of the textbox inside to get it to ellipsis!? :S:S