Question

Can someone help me understand the WPF stretch alignment. I often run into issues where I want a control to fill an area but I never understand on what level I should put the VerticalAlignment=”Stretch”. Specially when UserControls are involved.

I always solve the problem by trying different things or putting stretch on all levels but I would like to understand how to do it properly.

Lets take the example I got now:

• I have a grid with a fixed size cell (which can be resized with a GridSplitter)
• In this cell I have a UserControl containing a StackPanel with a TabControl
• In the TabControl I have TabItems containing another UserControl with a ListView

Or in some kind of pseudo XAML

<ns:MyUserControl1 Grid.Row="0" Grid.Column="0">
    <!-- this is in MyUserControl1 -->
    <StackPanel>
        <TabControl>
            <TabItem>
               <ns:MyUserControl2>
                    <!-- This is in MyUserControl2 -->
                    <ListView/>
               </ns:MyUserControl2>
            </TabItem>
        </TabControl>
    </StackPanel>
</ns:MyUserControl>

Now I want the ListView to fill the entire grid cell (excluding the TabControl and margins of course).

Answer 1

Your ListView will fill your MyUserControl2 – if you want this to fit within the whole Tab, you’ll need to make sure you remove the Height and Width constraints within the UserControl’s xaml file (these will default to 300 each)

EDIT: Apologies – I skipped the important part of your xaml… The MyUserControl1 container is a StackPanel… this will stack child controls and resize to fit them; If you replace it with a DockPanel (or a Grid), the child controls will fill the available space and give you the result you are after…

Have a look at this msdn article… Hope this helps 🙂