Understanding Frame and Page Navigation on the Windows Phone 7 platform

Introduction

Windows Phone application developers are aware that WP allows using both Silverlight and XNA for developing applications for the platform. The Silverlight-based WP page model might be familiar to many Silverlight developers (Check MSDN's Silverlight Navigation Overview if you need a refresher). However there are a few points which transcend when we talk of Windows Phone platform.

First, there is a dedicated "Back" hardware button on the Windows Phone 7 devices. Second, the form factor allows applications to be invoked out of turn (another application can be launched by clicking the Launch button and selecting an application) when you least expect it.

Elegant application developers are expected to handle such scenarios to ensure that their applications can fit naturally into the Windows Phone 7 navigation model and provide default transitions that mimic the Windows Phone 7 theme.

Windows Phone 7 applications are composed of a container element called PhoneApplicationFrame that can render PhoneApplicationPage.

When you create a default Windows Phone project, the default page has the following code, which illustrates this.

// In App.xaml.cs
public PhoneApplicationFrame RootFrame { get; private set; }

This indicates that the frame is the top most element in the navigation stack.

// In MainPage.xaml.cs
public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }
    }

The frame is the top most element in the navigation stack
Figure 1: The frame is the top most element in the navigation stack

Orientation changes

To tell your application that it has to support a different orientation, you need to set the SupportedOrientations property. You can specify the current orientation with the Orientation property. The orientation of how the page will be rendered is determined by how the device running the Windows Phone 7 application is oriented.

The splash screen is not considered a page since it is transient UI which does not persist and does not hold application state. The same analogy can be applied to the error dialogs and login pages. For transient UI screens, the default pop up invocation when the Back button is pressed should be overridden.

For a regular page, on "Back" button invocation, the application should either navigate to the previous page or exit.

How to navigate between pages

To navigate to a new page, you can call the NavigationService.Navigate API and pass in the desired page's relative URL.

NavigationService.Navigate(new Uri("/Pages/ShoppingCart.xaml", UriKind.Relative));

To go back to the previous page, you call the NavigationService.GoBack API.

NavigationService.GoBack();

Passing parameters across pages

To pass parameters across pages, your URI should contain the parameter as the message portion of the URI on the page from where you are navigating.

//Mainpage.xaml.cs
private void buttonNextPage_Click(object sender, RoutedEventArgs e)
{
NavigationService.Navigate(new Uri("/Pages/ShoppingCart.xaml?msg=" + arg1.Value, UriKind.Relative);
}

On the destination page, you write code to handle the passed argument.

//ShoppingCart.xaml.cs
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
base.OnNavigatedTo(e);
string argument = "";
if (NavigationContext.QueryString. TryGetValue("msg", out argument))
{
	textArgument.Text = argument;
}
}

Summary

In this article, we looked at how navigation works in Silverlight based Windows Phone 7 applications. I hope you have found this interesting.

About the Author

Vipul Patel is a Software Engineer currently working at Microsoft Corporation. He is currently working in the Office Communications Group and has worked in the .NET team earlier in the Base Class libraries and the Debugging and Profiling team. He can be reached at vipul_d_patel@hotmail.com



About the Author

Vipul Vipul Patel

Vipul Patel is a Software Engineer currently working at Microsoft Corporation, working in the Office Communications Group and has worked in the .NET team earlier in the Base Class libraries and the Debugging and Profiling team. He can be reached at vipul_d_patel@hotmail.com

Related Articles

Comments

  • There are no comments yet. Be the first to comment!

Leave a Comment
  • Your email address will not be published. All fields are required.

Top White Papers and Webcasts

  • Live Event Date: May 7, 2014 @ 1:00 p.m. ET / 10:00 a.m. PT This eSeminar will explore three popular games engines and how they empower developers to create exciting, graphically rich, and high-performance games for Android® on Intel® Architecture. Join us for a deep dive as experts describe the features, tools, and common challenges using Marmalade, App Game Kit, and Havok game engines, as well as a discussion of the pros and cons of each engine and how they fit into your development …

  • With JRebel, developers get to see their code changes immediately, fine-tune their code with incremental changes, debug, explore and deploy their code with ease (both locally and remotely), and ultimately spend more time coding instead of waiting for the dreaded application redeploy to finish. Every time a developer tests a code change it takes minutes to build and deploy the application. JRebel keeps the app server running at all times, so testing is instantaneous and interactive.

Most Popular Programming Stories

More for Developers

Latest Developer Headlines

RSS Feeds