How to make TextBlock wrap text inside a DockPanel?

Question

What do I need to do so that the inner TextBlock below wraps its text without determining the absolute width?

I tried Width = Auto, Stretch, TextWrapping, putting it in a StackPanel, it seems nothing works.

_{(source: deviantsart.com )}

XAML:

<UserControl x:Class="Test5.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:tk="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit" Width="800" Height="600"> <tk:DockPanel LastChildFill="True"> <StackPanel tk:DockPanel.Dock="Top" Width="Auto" Height="50" Background="#eee"> <TextBlock Text="{Binding TopContent}"/> </StackPanel> <StackPanel tk:DockPanel.Dock="Bottom" Background="#bbb" Width="Auto" Height="50"> <TextBlock Text="bottom area"/> </StackPanel> <StackPanel tk:DockPanel.Dock="Right" Background="#ccc" Width="200" Height="Auto"> <TextBlock Text="info panel"/> </StackPanel> <StackPanel tk:DockPanel.Dock="Left" Background="#ddd" Width="Auto" Height="Auto"> <ScrollViewer HorizontalScrollBarVisibility="Auto" Padding="10" BorderThickness="0" Width="Auto" VerticalScrollBarVisibility="Auto"> <tk:DockPanel HorizontalAlignment="Left" Width="Auto" > <StackPanel tk:DockPanel.Dock="Top" HorizontalAlignment="Left"> <Button Content="Add More" Click="Button_Click"/> </StackPanel> <TextBlock tk:DockPanel.Dock="Top" Text="{Binding MainContent}" Width="Auto" TextWrapping="Wrap" /> </tk:DockPanel> </ScrollViewer> </StackPanel> </tk:DockPanel> </UserControl> 

Answer 1

Have you tried changing the visibility of the scroll bar?

 <ScrollViewer HorizontalScrollBarVisibility="Disabled" Padding="10" BorderThickness="0" Width="Auto" VerticalScrollBarVisibility="Auto"> 

Answer 2

For some reason, the obvious (elegant) solution doesn't seem to work in SL:

 <ScrollViewer Name="w_scrollViewer" HorizontalScrollBarVisibility="Auto" Padding="10" BorderThickness="0" Width="Auto" VerticalScrollBarVisibility="Auto"> <tk:DockPanel Name="w_dp" HorizontalAlignment="Left" Width="Auto" > <TextBlock Margin="2" Name="w_tb" Text="{Binding MainContent}" TextWrapping="Wrap" Width="{Binding ActualWidth, ElementName=w_scrollViewer}" /> </tk:DockPanel> </ScrollViewer> 

but a little more "rough" way:

 <StackPanel SizeChanged="w_sp_SizeChanged" Name="w_sp" tk:DockPanel.Dock="Left" Background="#ddd" Width="Auto" Height="Auto"> <ScrollViewer Name="w_scrollViewer" HorizontalScrollBarVisibility="Auto" Padding="10" Width="Auto" VerticalScrollBarVisibility="Auto" SizeChanged="HandleScrollViewerSizeChanged" > <tk:DockPanel HorizontalAlignment="Left" Width="Auto" > <TextBlock Name="w_textBlock" Text="{Binding MainContent}" TextWrapping="Wrap" /> </tk:DockPanel> </ScrollViewer> </StackPanel> 

code behind:

 private void HandleScrollViewerSizeChanged(object sender, SizeChangedEventArgs e) { w_textBlock.Width = w_scrollViewer.ActualWidth; }