WPF Menu with Frame

Question

Hi,
I am looking at a WPF app, I created a page with a "Menu" and a frame, I am trying to figure out how to have the frame below the menu (menu showing up at the top of the page and the frame directly below the menu)
I get the Frame and menu when we load a new page, however it I cannot get it to load below the menu, it loads on the same row as the menu.

Like "NavigationView" under UWP

thanks

Answer 1

I do a demo with my understanding for your question, if I misunderstand your question, please point out.
Project Directory:

The xaml code is:

<Grid>  
        <Grid.RowDefinitions>  
            <RowDefinition Height="70"></RowDefinition>  
            <RowDefinition Height="300"></RowDefinition>  
        </Grid.RowDefinitions>  
        <WrapPanel Grid.Row="0"  x:Name="TopBar">  
            <TabControl  x:Name="LeftTabControl" TabStripPlacement="Top" Background="White" Height="70" Width="800">  
                <TabItem Header="Home" Height="65" Width="65" FontWeight="Bold" MouseLeftButtonUp="TabItem_MouseLeftButtonUp">  
                    <TabItem.Background>  
                        <ImageBrush ImageSource="/images/homeicon.png" />  
                    </TabItem.Background>  
                </TabItem>  
                <TabItem Header="Page1" Height="65" Width="65" FontWeight="Bold" MouseLeftButtonUp="TabItem_MouseLeftButtonUp" >  
                    <TabItem.Background>  
                        <ImageBrush ImageSource="/images/projects.png" />  
                    </TabItem.Background>  
                </TabItem>  
  
                <TabItem Header="Page2" Height="65" Width="65" FontWeight="Bold" MouseLeftButtonUp="TabItem_MouseLeftButtonUp">  
                    <TabItem.Background>  
                        <ImageBrush ImageSource="/images/taskicon.png" />  
                    </TabItem.Background>  
                </TabItem>  
  
                <TabItem Header="Page3" Height="65" Width="65" FontWeight="Bold"  MouseLeftButtonUp="TabItem_MouseLeftButtonUp">  
                    <TabItem.Background>  
                        <ImageBrush ImageSource="/images/email.png" />  
                    </TabItem.Background>  
                </TabItem>  
                
            </TabControl>  
        </WrapPanel>  
        <StackPanel Grid.Row="1" Orientation="Horizontal" Background="White" >  
            <Frame x:Name="pageContainer"  NavigationUIVisibility="Hidden"  />  
        </StackPanel>  
    </Grid>  

The cs code is:

 private void TabItem_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)  
        {  
            pageContainer.Content = null;  
            TabItem cmd = (TabItem)sender;  
            Type type = this.GetType();  
            Assembly assembly = type.Assembly;  
            Page page = (Page)assembly.CreateInstance(type.Namespace + "." + cmd.Header);  
            pageContainer.Content = page;  
        }  

The result picture is:

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.