This is the second post in “Discover Windows Phone” development series we’ll be covering Page Navigation.
This topic is important for the following two reasons:
1. because you don’t want to build your project based on only one page.
2. because you can make use that your application will automatically be able to leverage the phone’s built-in hardware back button. This will allow your user to navigate backwards in your application when they want to get back to what they were doing previously.
Let’s start applying how to simply navigate between pages
We have multiple pages, and we want to give the user a way to get between them. Let’s build a simple navigation UI that will allow us to do just that.
Last post we’ve created a default Windows Phone Application, let’s open it.
1) Open the application from where you saved it last time. Probably it will be in Documents>Visual Studio 2013>Projects
5) Repeat step 3 and 4 with page name Beverages.xaml and page name “Beverages”.
8) Change the text that appears on each button by going to the Properties windows on the left. Under Common, change Content from “button” to Meals. Do the same to button 2 and change Content to “Beverages”. Also change the name of each button from the same properties window as shown. Change names to “button_meals” and “button_beverages”.
9) Add a Click event to the button, that when you click on the button a special event happens, which in our case is to navigate to a specific page. To do this, double click on the button itself in the design view and it will automatically create an event handler and take you to the C# page where you write what happens when the button is clicked. Do the same click to the second button.
10) Now is finally time to write the statement of navigation to another page.
NavigationService.Navigate( new Uri("/Meals.xaml", UriKind.Relative));
And for button_beverages
NavigationService.Navigate( new Uri("/Beverages.xaml", UriKind.Relative));
Download the Source code from here:
As you can see, by simply navigating using the NavigationService, all of your user’s actions are recorded, and using the Back button will allow them to return through their decision tree. Next post will be covering Application Bar.
For any feedback or questions: