mainPage.xaml does not load into mainWindowMain frame in MainWindow.xaml

Question

I have two xaml: MainWindow.xaml. After running program i have only window with text:"mainPage.xaml". There is no menu or jpg that i had setup in mainPage.xaml

MainWindow.xaml code:

<Window x:Class="FK.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="A and I Version 0.1" Height="1080" Width="1920">

<Grid Background="LightGray">

    <Grid.RowDefinitions>
        <RowDefinition Height="auto"></RowDefinition>
    </Grid.RowDefinitions>
    <Frame x:Name="mainWindowMain"
           Grid.Row="0">
    </Frame>
</Grid>

MainWindow.xaml.cs code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace FK
{
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        mainWindowMain.Content = new Uri("mainPage.xaml", UriKind.Relative);
    }
}
}

mainPage.xaml code:

<Window x:Class="FK.mainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:FK"
    mc:Ignorable="d"
    Title="mainPage" Height="450" Width="800">
<Grid Background="LightGray">
    <Grid.RowDefinitions>
        <RowDefinition Height="20"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>
    <Menu 
        x:Name="mainWindowMainMenu"
        Grid.Row="0"
        HorizontalAlignment="Left"
        VerticalAlignment="Top"
        Height="20"
        Width="auto"
        >
        <MenuItem Header="Menu" Height="20" Width="50">
            <MenuItem x:Name="menuOpcjaFinances"
                      Header="Finances"
                      InputGestureText="Ctrl+F"
                      Height="20"
                      Width="200"
                      >

            </MenuItem>
            <MenuItem x:Name="menuOpcjaInvoices"
                      Header="Invoces"
                      InputGestureText="Ctrl+I"
                      Height="20"
                      Width="200">
            </MenuItem>
            <MenuItem x:Name="menuOpcjaPomoc"
                      InputGestureText="Ctrl+H"
                      Header="Help"
                      Height="20"
                      Width="200"
                      >

            </MenuItem>
            <MenuItem x:Name="menuOpcjaWyjscie"
                      InputGestureText="Ctrl+Q"
                      Header="Exit"
                      Height="20"
                      Width="200"
                      ></MenuItem>
        </MenuItem>
    </Menu>
    <Image Grid.Row="1"
           Source="/mainPicture_.jpg"
           VerticalAlignment="Stretch"
           HorizontalAlignment="Center"></Image>
</Grid>
</Window>

When I had in MainWindow two gridrows, in first gridrow i had menu from mainPage.xaml, and in second grid i had frame, after clicking one of menu, other xaml loads without any problems into the frame.

I tried to setup two gridrows in MainWindow, i have tried to make public void with mainWindowMain.Content = new Uri("mainPage.xaml", UriKind.Relative); and insert the void in public MainWindow, but it does not help. I have no errors while compiling the program, i do not know where to search the problem

don't use frame in your case. Just copy and paste your code from mainPage.xaml into MainWindow.xaml, that is where you want to have your menu. Then, in MainWindow.xaml add ContentControl. This control will let you add your whatever Views, via Content just like a frame - but more lightweight. This is how things work better in WPF. Learn about MVVM & binding too, just an advice. — LuckyLuke82
i would try to explain why i did that. I will have several files mainPage, secondPage, thirdPage. Every page will have another menu. mainPage have menu "Menu", but secondPage would have "menu", "Documents", "Prints". ThirdPage will have "Menu", "Invoices", "Tax". At the beginning i had in MainWindow.xaml two gridrows, first row heigh 20 for the menu. When i could create frame and can load secondPagemenu, and second gridrow with frame when i can load rest of the window from secondPage.xaml — pawel_wpf
frame is intended for pages with navigation. Other than that It's pointless. You'll have more problems with It as with ContentControl, believe me. If you're trying to make an app with a menu and show Windows or Views under It, then drop off a frame. — LuckyLuke82
i have edited last cxomment. What should i use to have another menu in every each option. How to load another xaml into window below the menu? — pawel_wpf

LuckyLuke82 LuckyLuke82 · Accepted Answer · 2020-10-01T07:54:59

First of all, your design is weird. You should have only one menu, in your MainWindow.xaml. Secondly - again - drop off frame control and use ContentControl instead. Frame control is heavy and It's not useful unless you want navigation and all It's features, like navigation history. Drop off Pages too, what you need is to go into the world of UserControls.

For your other "pages" - having each one It's own menu - you think this is nice design? Having top menu and then underlying view have another menu, really ?...I think your views (Pages in your case) should have TabControl, that would look and feel more normal to user. So your app would have top menu to navigate between views, and your views would have Tabs like "Invoices","Tax". That is only my opinion though.

However, you'll need to learn a lot more what WPF provides to you. I suggest you dig into MVVM pattern, WPF bindings, dependency injections, DataTemplates, Command bindings etc. Learning curve is steep, but you'll be glad once you'll figure It out.

Useful links for your answer:

navigation using ContentControl - MVVM article

SO question - check accepted answer

But, If you are a beginner, you can do It without MVVM pattern. Like you did, in code behind.

AND FINAL: If you still persist on your design, then instead of this line:

mainWindowMain.Content = new Uri("mainPage.xaml", UriKind.Relative);

create a click event of your MenuItem (in MainWindow) in code behind:

 private void Menu_item_Click(object sender, RoutedEventArgs e)
 {
     mainWindowMain.Navigate(new mainPage());
 }

mainPage.xaml does not load into mainWindowMain frame in MainWindow.xaml

2 Answers