How to get a TextBlock to wrap text inside a DockPanel area?

Question

What do I have to do to get the inner TextBlock below to wrap its text without defining an absolute width?

I've tried Width=Auto, Stretch, TextWrapping, putting it in a StackPanel, nothing seems to work.

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

Check out this answer: http://stackoverflow.com/questions/386039/wpf-textbox-and-scroll-behavior

Answer 2

Have you tried changing the scrollbar visibility?

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

Answer 3

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 bit 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;
}