Basic Page Navigation In UWP

In this article, we will learn how to create a basic application for page navigation.

Page navigation is basically moving or surfing from one page to another page when a command or instruction is provided to navigate. Here, we will use the button to create and provide page navigation. We will create a hello world display and navigate to that page through a simple button click.

Requirements

  • Visual Studio
  • OS (windows 10)

Steps to follow,

Step 1

Open Visual Studio -> file ->new Project,

UWP

 

Steps 2

A pop window will appear now select the C# -> Blank app (universal Windows)

UWP

Step 3

In the solution, Explorer clicks MainPage.xaml to go to the designer page.

UWP

 

Step 4

From the toolbox, Drag and Drop the Button.

UWP

Step 5

Go to properties right click ->Add new item-> Existing Item-> Blank page.

In the Blank page add an Image Box from the Toolbox.

UWP

Step 6

Go to Solution Explorer and right-click on Asset-> Existing item ->Click an image you wish to add.

UWP

Step 7

Click the picture you wish to publish, the picture will be displayed on the designer page in the image box.

UWP

Step 8

Go back to the MainPage.xaml and double click on the Button you have placed. It will lead you to the coding page and you can see the coding button predefined. Add the code for the page navigation. “This.Frame.Navigate(type of(BlankPage1),null);”

UWP

 

Step 9

Run the uwp application in the local machine.

When you click the button in the MainPage that will lead you to the page on which we placed an image.

UWP

UWP

Summary

In this article, we learned how to create a page navigation application. We learned how to add a blank page, add an image to it and deploy the page navigation application. More interesting articles are coming up.