You use the Frame control to support navigation to Silverlight Page controls. You create as many different pages as needed to present the content in your application and then navigate to those pages from the frame. When a Uniform Resource Identifier (URI) is requested, either programmatically or through a user action, the frame navigates to the page that matches the URI.

The requested URI can include not only the page to display, but also values that represent a particular state for the page. Within the page, you provide logic to process the URI values and create the page in the correct state.

The frame supports forward and back navigation in the navigation history. Forward and back navigation enables users to conveniently navigate between previously viewed pages and between previously viewed states for a page. You use the GoBack and GoForward methods to launch back and forward navigation requests. A top-level frame (one not nested within another frame) that is hosted in a Web browser can integrate with the browser navigation. You set the JournalOwnership property to specify whether the frame manages its own navigation history, or whether it integrates with the Web browser journal. When integrated with the browser navigation, a user can use the forward and back buttons in the browser to navigate to different states in the Silverlight application.

By default, the frame displays the page that matches the URI request. For example, a request for the URI value /Views/HomePage.xaml means that the frame will display the page located within the application at /Views/HomePage.xaml. However, you can map a particular URI pattern to a file that handles the URI request for that pattern. For example, you can specify that a request for /Home maps to a request for /Views/HomePage.xaml. URI mapping enables you to use user-friendly URIs that do not reflect the exact location of a file in your application.

Through the UriMapper property, you provide a collection of URI patterns that map to Silverlight pages. You define the pattern and the mapped URI by adding a UriMapping object to the UriMappings property of the UriMapper class. You map a matching URI for only the portion of the URI that pertains to navigation within the frame that contains the mappings. For a browser-integrated navigation, the URI is found after the fragment delimiter (#). For example, if your browser-integrated Silverlight application is hosted at http://www.contoso.com/Default.aspx, you specify a matching URI for http://www.contoso.com/Default.aspx#/Home by creating an instance of UriMapping that only matches /Home. For applications that are not integrated with a browser, the URI will also be /Home.

The URI pattern you specify does not have to be the exact URI to match against the requested URI. The pattern can include placeholder segments in the URI that will match any value in that segment. You specify a placeholder segment by enclosing the name of the segment with the curly braces ( { and } ). These placeholder segments act as variables when mapping to the URI. For example, in the App.xaml file, you can specify the following UriMapping instance:

<uriMapper:UriMapping Uri="Products/{type}" 
  MappedUri="/Views/ProductDetail.xaml?producttype={type}">
</uriMapper:UriMapping>

The pattern Products/{type} will match any request that includes Products followed by a segment. The matching URIs could include Products/bikes, Products/kitchen or any other similar request. The value specified in the second segment is included in the query string of the mapped URI where the matching {type} value is defined.

You set the CacheSize property to specify how many pages can be retained in a cache. When a page is cached, an instance of the page is reused for each navigation request instead of re-creating the page for each request. To cache a page, you must also set the NavigationCacheMode property of the Page class to either Enabled or Required. When a page's NavigationCacheMode property is set to Required the page is cached regardless of the number of cached pages specified in the CacheSize property. Pages marked as Required do not count against the CacheSize total.

Note:
The Frame control is available as part of the libraries in the Silverlight Software Development Kit (SDK). For more information, see the Silverlight Tools.

The following example shows the XAML for a frame that includes URI mapping definitions. The frame will navigate to the value of its Source property, which in this example is set by default to /Home.

<navigation:Frame 
       x:Name="ContentFrame" 
       Style="{StaticResource ContentFrameStyle}" 
       Source="/Home" 
       Navigated="ContentFrame_Navigated" 
       NavigationFailed="ContentFrame_NavigationFailed">
    <navigation:Frame.UriMapper>
        <uriMapper:UriMapper>
            <uriMapper:UriMapping 
                Uri="/ProductDetail/{productid}" 
                MappedUri="/Views/ProductDetail.xaml?ProductId={productid}"/>
            <uriMapper:UriMapping 
                Uri="/Reports/{type}/{selection}" 
                MappedUri="/Views/ReportsPage.xaml?type={type}&amp;selection={selection}"/>
            <uriMapper:UriMapping 
                Uri="/{pageName}" 
                MappedUri="/Views/{pageName}.xaml"/>
        </uriMapper:UriMapper>
    </navigation:Frame.UriMapper>
</navigation:Frame>

For a list of the operating systems and browsers that are supported by Silverlight, see Supported Operating Systems and Browsers.

Reference

Other Resources