WPF: Layout Question

Question

My user control has two sub-controls, a list and a detail.

• When nothing is selected in the list, I want the list to fill the entire control
• When something is selected, I want the list to fill the top half and the detail control the bottom half.

Dynamically changing the visibility on the detail control is easy. What I'm stuck on is how to resize the list.

Answer 1

Can you not just put the list inside a <Border> or a <Grid> or something and just resize that? Or if you want scrollbars you could put it inside a <ScrollViewer>.

Answer 2

How do you change the visibility? If you put your subcontrols in a grid with the following RowDefinitions:

<Grid.RowDefinitions>
    <RowDefinition/>
    <RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

with list in the first row and detail control in the second then setting Visibility = Collapsed of the detail control should automatically resize the list.

Answer 3

Stanislav gave me an idea. Use a gird of two rows, but don't set the heigth. Instead have the upper control RowSpan across both halves of the screen.

Upper control:

Grid.RowSpan="{p:PyBinding 1 if ($[MainList.SelectedIndex] > -1) else 2}"

Lower Control:

Visibility="{p:PyBinding BooleanToVisibility($[MainList.SelectedIndex] > -1)}"