Understanding Frame and Page Navigation on the Windows Phone 7 platform | CodeGuru

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 […]

Written By
CodeGuru Staff
CodeGuru Staff
Apr 14, 2011
2 minute read
CodeGuru content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More

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.

Advertisement

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

CodeGuru Logo

CodeGuru covers topics related to Microsoft-related software development, mobile development, database management, and web application programming. In addition to tutorials and how-tos that teach programmers how to code in Microsoft-related languages and frameworks like C# and .Net, we also publish articles on software development tools, the latest in developer news, and advice for project managers. Cloud services such as Microsoft Azure and database options including SQL Server and MSSQL are also frequently covered.

Property of TechnologyAdvice. © 2026 TechnologyAdvice. All Rights Reserved

Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.