Single Page App with C# WPF/XAML

 In this post we are going to create a single page app. The app will have multiple pages that get rendered in the main window. We will be using Visual Studio, C#, WPF and XAML.

Let's start by creating a new project in Visual Studio of this type:

Next, in the MainWindow, we define the interface structure.

On the left side we place a menu and on the right side a DockPanel with a Frame in it.

The Frame is the element that is used to render de pages content.

Now let's add the new pages. In this example I will add two pages. Click in the Solution Explorer with the mouse right button, then choose Add and Page.

The project looks like this.

The app content goes on the recently create pages. Because this is just an example I will just change the background color and add a small text.

Page1

Page2

Finally the code. Back to the MainWindow we need to create the click events on the menu items. So, in the MenuItem line add the click event and pick New Event Handler.

If that option doesn't show up just press CTRL+SPACE.

Visual Studio will generate the functions associated with the events, press F7 to go edit them.

Each function just needs one line of code, like so:

With this code the Page1 content will be rendered in the Frame of the MainWindow. Change the other function for Page2.

And that's it.

The project is here.