Question

<navigation:Page 
    d:DesignHeight="768" d:DesignWidth="1366">
    <UserControl.Resources>
        <sdk:HierarchicalDataTemplate x:Key="Level3">
            <StackPanel Orientation="Horizontal">
                <ContentPresenter Margin="0 0 4 0" Content="{Binding IconUri}"/>
                <HyperlinkButton x:Name="TemplateLinkButton" Content="{Binding MenuCaption}" NavigateUri="{Binding Uri}"/>
            </StackPanel>
        </sdk:HierarchicalDataTemplate>
        <sdk:HierarchicalDataTemplate x:Key="Level2" ItemsSource="{Binding Path=Children}" ItemTemplate="{StaticResource Level3}">
            <StackPanel Orientation="Horizontal">
                <ContentPresenter Margin="0 0 4 0" Content="{Binding IconUri}"/>
                <HyperlinkButton x:Name="TemplateLinkButton" Content="{Binding MenuCaption}"  NavigateUri="{Binding Uri}"/>
            </StackPanel>
        </sdk:HierarchicalDataTemplate>
        <sdk:HierarchicalDataTemplate x:Key="Level1" ItemsSource="{Binding Path=Children}" ItemTemplate="{StaticResource Level2}">
            <StackPanel Orientation="Horizontal">
                <ContentPresenter Margin="0 0 4 0" Content="{Binding IconUri}"/>
                <TextBlock  Text="{Binding Path=MenuCaption}"/>
            </StackPanel>
        </sdk:HierarchicalDataTemplate>
    </UserControl.Resources>
        <Grid x:Name="LayoutRoot"    ShowGridLines="True" Background="Blue">
        <Grid.RowDefinitions>
            <RowDefinition Height="100"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBlock  Grid.Row="0"  VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Text="Header" Name="textBlockHeader"/>
        <Grid  Grid.Row="1"     HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ShowGridLines="True" Background="Pink">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <ScrollViewer    Height="Auto" Background="CadetBlue">
                <sdk:TreeView Name="menuTree"  ItemTemplate="{StaticResource Level1}"     Background="Fuchsia">
            </sdk:TreeView>
        </ScrollViewer>
        <sdk:Frame  HorizontalAlignment="Stretch" Grid.Column="1" VerticalAlignment="Stretch" Source="" Name="contentFrame">
            <sdk:Frame.UriMapper>
                <sdk:UriMapper>
                    <sdk:UriMapping MappedUri="/VIEW/{page}.xaml" Uri="/{page}" />
                </sdk:UriMapper>
            </sdk:Frame.UriMapper>
        </sdk:Frame>
        </Grid>
    </Grid>
</navigation:Page>

This is a default layout header menu and content frame, I want the scrollviewer fill the grid Grid2’s first column. I tried margin VerticalAlignment height= "Auto", but it didnt work yet.

Answer 1

When you have issues with filling and aligning, a good way to see what container and/or children are causing this is to give everything a different background color. That way, you could see if the grid is stretched, where the child grows to, …

This question has been resolved already, but I just wanted to share this method, as it has helped you find what was wrong in your case too.