Autosize inside a WrapPanel?

Question

Need help with a xaml Layout.

I have a Wrapanel with two elements inside. The left one, MainGrid, needs to be fixed at 900 pixels. The second one, AuxillaryDataScrollViewer, I would like to be a minimum of 650 and a maximum of 100% if the WrapPanel wraps it. Is this possible?

Here's what I got so far:

<Window x:Class="scratch.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="768" Width="1024">
    <Grid>
        <ScrollViewer>
            <WrapPanel>
                <Grid Width="900" Height="800" Background="Bisque"></Grid>
                <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Hidden" Width="650">
                    <Grid Width="1500" Height="700" Background="Tomato"></Grid>
                </ScrollViewer>
            </WrapPanel>
        </ScrollViewer>
    </Grid>   
</Window>

Thanks!

Edit adding more detail:

Client would like to do data entry and see the calculated results realtime in a panel to the right, but some of the computers in his lab are only capable of 1280pixels width so on those machines he would like the results to wrap to below the data entry form.

If the monitor has the resolution, if not i want it to wrap. — safetyOtter
Thank you for looking at the code, It doesn't quite do what I need as it doesn't stretch to the full page width if it is wrapped. — safetyOtter

McGarnagle McGarnagle · Accepted Answer · 2014-03-05T23:26:16

Since the requirement is so well defined, you could simply add a SizeChanged handler, and set the second element's width manually per the container's width. If the container is less than 900 + 650, then stretch the second element to 100% of the container.

public MainWindow()
{
    SizeChanged += MainWindow_SizeChanged;
}

void MainWindow_SizeChanged(object sender, SizeChangedEventArgs e)
{
    double firstElementWidth = MainGrid.Width;                          // 900
    double secondElementMinWidth = AuxillaryDataScrollViewer.MinWidth;  // 650 

    double secondElementWidth;

    // if wrapped, stretch to the container
    if (e.NewSize.Width < firstElementWidth + secondElementMinWidth)
        secondElementWidth = e.NewSize.Width;
    // otherwise (not wrapped), fill the remainder of the first row
    else
        secondElementWidth = e.NewSize.Width - firstElementWidth;
}

Obviously this is quick-and-dirty. If you need something more robust, then I suggest writing a custom panel that adheres to the conventions you need. The WrapPanel can't stretch elements to the overall width, but there's no reason you couldn't design a panel that does.

Autosize inside a WrapPanel?

1 Answers