Navigating Between Pages

October 21, 2011

If your application has more than one page, you will need to provide a way for users to navigate between those pages.

You Will Learn

• How to navigate to another page using a hyperlink.
• How to navigate to another page using a navigation service.

Applies To

• Silverlight for Windows Phone OS 7.1

  

Aside from the automatic navigations at startup and shutdown, navigation typically takes place as a result of tapping a UI control, such as a hyperlink or a button, or pressing the Back button. The Back button automatically navigates backward without any special handling.

The easiest way to perform page navigation is by using a HyperlinkButton control. You can use its NavigationUri property to navigate to a page. The following example shows how to navigate to a page named SecondPage.xaml.

<HyperlinkButton NavigateUri="SecondPage.xaml" />

If you do not want to use a HyperlinkButton, you can perform navigation by using the NavigationService class. This class contains several properties, methods, and events to help you with navigation. You can use the NavigationService.Navigate method to navigate to a specific page. The following code shows a click event handler for an Application Bar button that calls the Navigate method.

private void FillupButton_Click(object sender, EventArgs e)
{
    NavigationService.Navigate(
        new Uri("//Views/FillupPage.xaml", UriKind.Relative));
}

Private Sub FillupButton_Click(ByVal sender As Object, ByVal e As EventArgs)
    NavigationService.Navigate(
        New Uri("//Views/FillupPage.xaml", UriKind.Relative))
End Sub

The Navigate method always creates a new instance of the page at the specified URI. You can also add URI parameters to initialize the requested page to a given state (the Fuel Tracker application does not pass state information in URI parameters). Other options for passing data between pages include using application-level properties, external service classes, or the PhoneApplicationService.State property.

For backward navigation, you call the NavigationService.GoBack method, which returns to the previous page instance. Of course, this duplicates the functionality of the Back button, so you will typically call this method as part of some other functionality.

For example, in Fuel Tracker, the car details page and the fill-up page each have a Save button that saves user changes and then navigates back to the summary page. If the user presses the Back button instead, the backward navigation occurs without saving the data. Applications must always request confirmation before discarding user data, so it is useful to respond to Back button presses when there will be data loss. For more information, see Validating Data Entry Input.

Design Guideline:
The Back button automatically goes back or exits the application. You should not override except in the case of data loss. For more information, see Navigation, Orientation, and Gestures for Windows Phone.

For more information about application navigation, see the Navigation QuickStart, Frame and Page Navigation for Windows Phone, and How to: Perform Page Navigation on Windows Phone.

Next Topic | Previous Topic | Home