Let the window grow according to the size of one control, but not the other

advertisements

I've got a window containign a textblock with variable text and a stackpanel which contains a variable amount of buttons.

How can I let the window grow in width (horizontally), when the stackpanel grows in width but let the text always adapt to the available width (not grow the window in width when the text gets longer).

I've tried some combinations with and without Width="Auto" / VerticalAlign="Stretch" / TextWrapping etc. but I only get the window to grow if either one (text length / stackpanel children) grow in width.

I want the text to wrap based on the width of the window which shall be based on the width of the stackpanel. XAML only would be nice.

Edit

As requested some stripped-down markup to reproduce the issue:

<Window
    Width="500"
    Height="225"
    MinWidth="500"
    MinHeight="225"
    HorizontalAlignment="Stretch"
    SizeToContent="WidthAndHeight"
    ResizeMode="NoResize">

    <Grid HorizontalAlignment="Stretch" Width="Auto">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="35"/>
        </Grid.RowDefinitions>

        <!-- Text should adapt to the available width but not grow the window. Instead it should scroll vertically -->
        <ScrollViewer Grid.Row="0" Margin="15" VerticalScrollBarVisibility="Auto">
            <TextBlock TextWrapping="Wrap" Height="Auto">...Some Binding...</TextBlock>
        </ScrollViewer>

        <!-- Should be as wide as it needs to be, growing the window in width if neccessary -->
        <StackPanel x:Name="ButtonStackPanel" Grid.Row="1" FlowDirection="RightToLeft" Orientation="Horizontal" Width="Auto">
            ...Some Buttons...
        </StackPanel>
    </Grid>
</Window>

Edit 2 The window is supposed to have a MinWidth of 500, if there's only one button in the stackpanel, it should still stretch full width (500px).

Edit 3 - Some more pictures

Correct - Text is short, only one button -> MinWidth 500

Wrong - Text is long and should wrap at the MinWidth of 500 because only the Stackpanel should be allowed to grow the window in width
Correct - Short text but stack panel grows the window


You have to bind the Width of the Window to the outer Grid's Width (as Mighty Badaboom suggested) and the Width of the ScrollViewer to the ActualWidth of your StackPanel.

Here is how you can achieve it:

<Window SizeChanged="MainWindow_OnSizeChanged" Height="225" SizeToContent="Width" ResizeMode="NoResize">
<Grid Name="OuterGrid" MinWidth="500">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="35"/>
    </Grid.RowDefinitions>

    <ScrollViewer Grid.Row="0" Margin="15" VerticalScrollBarVisibility="Auto">
        <TextBlock TextWrapping="Wrap" Height="Auto">...Some Binding...</TextBlock>
    </ScrollViewer>

    <StackPanel Grid.Row="1" HorizontalAlignment="Stretch" Background="Blue">
        <StackPanel x:Name="ButtonStackPanel" HorizontalAlignment="Center" Grid.Row="1" FlowDirection="RightToLeft" Orientation="Horizontal" Width="Auto">
            ...Some Buttons...
        </StackPanel>
    </StackPanel>
</Grid>
</Window>

And code behind:

private void MainWindow_OnSizeChanged(object sender, SizeChangedEventArgs e)
{
    if (e.WidthChanged)
        OuterGrid.Width = Panel.ActualWidth;
}

EDIT: Added an outer StackPanel to support Stretching & blue Background requirement.

EDIT 2: It seems that you can't achieve the behavior you're describing with only XAML. Although the fix is a few lines of code away.