Silverlight导航概述

本主题描述了常见导航方案，并提供了有关如何将导航功能添加到应用程序的指导。

涉及的导航概念如下：

• 应用程序导航。

• Web 浏览器集成导航。

• 外部导航。

应用程序导航

在 Silverlight 应用程序中使用 Frame 和 Page 控件可以实现应用程序导航。页面控件表示内容的分立部分。框架用作页面控件的容器，并使页导航非常简便。在任一时刻，框架只显示一个页面的内容。以编程方式或通过用户操作导航到新页时，框架中显示的页将会更改。

可以将 Silverlight 应用程序的根视觉效果设计为包含可导航内容和永久用户界面 (UI) 组件（例如页眉、页脚和导航边栏）的组合。使用"Silverlight 导航应用程序"模板创建新项目时，该模板会生成一个包含永久 UI 组件的 XAML 文件并为可导航内容生成一个框架。

下面的示例演示一个简单框架，它存在于名为 MainPage 的 UserControl 控件内。您可以在 ContentFrame 之前或之后向 LayoutRoot 添加其他 UI 组件。Source 设置为 /Views/Home.xaml 表示默认情况下，框架中显示的页是位于 /Views/Home.xaml 的页。

复制代码

<usercontrol x:class="SilverlightApplication.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:ignorable="d" d:designwidth="640" d:designheight="480"><grid x:name="LayoutRoot"><frame x:name="ContentFrame" source="/Views/Home.xaml"></grid></usercontrol>

通过使用"添加新项"对话框，然后选择"Silverlight 页"，可以将新页添加到应用程序中。Visual Studio 中的"Silverlight 导航应用程序"模板会创建一个名为 Views 的文件夹，其中包含这些页。您可以向此文件夹添加页，也可以在应用程序中最适当的任何位置添加页。

创建用户友好的 URI

在框架中，可以为特定页面指定某种 URI 模式映射。使用 URI 映射可以创建说明用户操作的 URI，而不是文件的路径。例如，可以指定对 /Home 的任何请求实际上是对位于 /Views/Home.xaml 的文件的请求。不与任何已定义模式匹配的所有请求都作为常规 URI 请求来处理，不会映射到其他页。下表演示 URI 映射定义的示例以及如何解析这些示例请求。

URI 映射定义

匹配 URI 示例

解析后的 URI

Uri = "/Home"

MappedUri = "/Views/Home.xaml"

/Home

/Views/Home.xaml

Uri = "/{page}"

MappedUri = "/Views/{page}Page.xaml"

/About

/Views/AboutPage.xaml

Uri = "/Product/{category}"

MappedUri = "/ContosoShop/Product.xaml?category={category}"

/Product/bikes

/ContosoShop/Product.xaml?category=bikes

Uri = "/{reporttype}/{month}/{format}"

（在 XAML 中）MappedUri = "/Views/Reports/{reporttype}.xaml?time={month}&show={format}"

（在 Visual Basic 或 C# 中）MappedUri = "/Views/Reports/{reporttype}.xaml?time={month}&show={format}"

/Sales/June/Short

/Views/Reports/Sales.xaml?time=June&show=Short

向框架添加 URI 映射的方法是定义 UriMapper 类（或派生自 UriMapperBase 类的自定义类）的一个实例以及任意数量的 UriMapping 实例。您指定的模式不必是与所请求 URI 完全匹配的 URI。该模式可以在 URI 中包含占位符段，URI 将匹配该段中的任何值。将占位符段的名称括在大括号（{ 和 }）中可以指定占位符段。在映射 URI 时，占位符段充当变量。任何没有括在大括号中的值表示文本值，要与模式匹配的 URI 必须存在该值。下面的示例演示包含占位符值的 URI 模式。

XAML

复制代码

<frame x:name="ContentFrame" style="{StaticResource ContentFrameStyle}" source="/Home" navigated="ContentFrame_Navigated" navigationfailed="ContentFrame_NavigationFailed">

URI 请求将映射为与该请求匹配的第一个模式。因此，应按照从最具体到最一般的顺序添加 URI 映射实例。例如，下面的定义是按照从具体文本值到一般占位符值正确排序的。对 /SalesReport 的请求将映射为 /Views/Reports/Sales.xaml。

复制代码

<frame x:name="ContentFrame" source="/Home">

但是，如果颠倒 URI 映射定义的顺序，对 /SalesReport 的请求将不会映射为 /Views/Reports/Sales.xaml。相反，第一个定义 /{page} 将匹配每一个段请求，包括 /SalesReport。该请求将映射为 /Views/SalesReportPage.xaml。

方便页导航

Frame 类提供用于页导航的方法和属性。将 Source 属性设置为要显示的页的 URI，或调用 Navigate 方法并将该页的 URI 作为参数来传递。也可以使用 GoBack 和 GoForward 方法在导航历史记录中向前或向后导航。

可以使用 HyperlinkButton 控件使用户能够在应用程序的各页中导航。HyperlinkButton 控件位于框架承载的 Silverlight 页内时，应将 NavigateUri 属性设置为映射到某一页的 URI，而不要设置 TargetName 属性。宿主框架将导航到请求的页。下面的示例演示一个包含了导航到应用程序中另一页的 HyperlinkButton 的页。

复制代码

<page x:class="SilverlightApplication.Home" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" mc:ignorable="d" d:designwidth="640" d:designheight="480" title="Home"><grid x:name="LayoutRoot"><hyperlinkbutton navigateuri="/About" content="About"></hyperlinkbutton></grid></page>

HyperlinkButton 控件位于框架外时，可以通过将 NavigateUri 属性设置为映射到某一页的 URI 并将 TargetName 属性设置为该框架的名称来启用对该框架内资源的导航。下面的示例演示一个框架和两个位于该框架外的 HyperlinkButton 控件。HyperlinkButton 控件使导航到框架内所显示的页面非常简便。这两个 HyperlinkButton 控件上的 TargetName 属性均设置为 ContentFrame，它是指派给框架的名称。

复制代码

<grid x:name="LayoutRoot"><border><frame x:name="ContentFrame" source="/Home"></border><grid><border><stackpanel><hyperlinkbutton navigateuri="/Home" targetname="ContentFrame" content="home"></hyperlinkbutton><hyperlinkbutton navigateuri="/About" targetname="ContentFrame" content="about"></hyperlinkbutton></stackpanel></border></grid></grid>

需要以编程方式从某一页启动导航请求时，必须首先获取宿主框架使用的 NavigationService 对象。NavigationService 类提供用于页导航的成员，如 GoBack、GoForward 和 Source。有关演示使用 NavigationService 对象的 Silverlight 页的示例，请参见本主题后面的"应用程序导航示例"。

Web 浏览器集成导航

对于未嵌套在另一个框架内的框架，可以集成框架导航与 Web 浏览器导航。浏览器集成导航无法用于脱离浏览器的应用程序。与浏览器集成时，使用 Web 浏览器的前进和后退按钮可导航到顶级框架的导航历史记录中的请求。用户通过 Web 浏览器的前进或后退按钮，可导航到其他 Silverlight 页。使用浏览器集成导航，用户可直接在浏览器窗口中键入一个 URI，表示该 URI 的页将显示在 Silverlight 应用程序中。因此，用户可以将一个 URI 设为书签或共享不仅与 Silverlight 应用程序对应，还与处于特定状态的应用程序对应的超链接。

设置 JournalOwnership 属性可指定是否将一个框架与 Web 浏览器导航相集成。默认情况下，该属性设置为 Automatic，这表示当该框架为顶级框架时，它将与浏览器日记集成在一起。将 JournalOwnership 属性设置为 OwnsJournal 可以禁止浏览器集成导航，也就是该框架保留自己的导航日志。

应用程序导航示例

在之前的示例中，定义了以下模式的一个 URI 映射：

复制代码

<urimapping uri="/ProductDetail/{productid}" mappeduri="/Views/ProductDetail.xaml?ProductId={productid}"></urimapping>

下面的示例使用该 URI 映射使用户能够直接导航到显示有关用户所请求产品的数据的页。本示例演示显示产品相关数据的 XAML 页。该页还包含将可从该页启动向前和向后导航的按钮。

XAML

复制代码

<page x:class="NavExample.Views.ProductDetail" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:ignorable="d" xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" d:designwidth="640" d:designheight="480" title="Product Information"><stackpanel x:name="LayoutRoot"><listbox x:name="ListBox1" itemssource="{Binding}"><listbox.itemtemplate><datatemplate><stackpanel><textblock text="{Binding Name}"></textblock><textblock text="{Binding ProductNumber}"></textblock><textblock text="{Binding Color}"></textblock><textblock text="{Binding Size}"></textblock><textblock text="{Binding ListPrice}"></textblock></stackpanel></datatemplate></listbox.itemtemplate></listbox><stackpanel horizontalalignment="Center" orientation="Horizontal"><button width="100" x:name="BackNavButton" click="BackNavButton_Click" content="&lt;&lt; back" visibility="Collapsed"></button>
            <button width="100" x:name="ForwardNavButton" click="ForwardNavButton_Click" content="forward &gt;&gt;" visibility="Collapsed"></button>
        </stackpanel></stackpanel></page>

以下示例演示代码隐藏页。该页访问 ADO.NET 数据服务以检索数据，但实现该数据服务的步骤不在此演示。有关数据服务的更多信息，请参见 ADO.NET 数据服务 (Silverlight)。请求的产品 ID 从查询字符串检索，并在数据服务查询中传递。该页的导航服务用于确定向前和向后导航是否可用。

Visual Basic

复制代码

Partial Public Class ProductDetail
    Inherits Page

    Public Sub New()
        InitializeComponent()
    End Sub


    Protected Overrides Sub OnNavigatedTo(ByVal e As NavigationEventArgs)
        GetProductDetail()
        SetButtonVisibility()
    End Sub

    Private Sub SetButtonVisibility()
        If (NavigationService.CanGoBack) Then
            BackNavButton.Visibility = Visibility.Visible
        Else
            BackNavButton.Visibility = Visibility.Collapsed
        End If

        If (NavigationService.CanGoForward) Then
            ForwardNavButton.Visibility = Visibility.Visible
        Else
            ForwardNavButton.Visibility = Visibility.Collapsed
        End If
    End Sub

    Private Sub BackNavButton_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
        If (NavigationService.CanGoBack) Then
            NavigationService.GoBack()
        End If
    End Sub

    Private Sub ForwardNavButton_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
        If (NavigationService.CanGoForward) Then
            NavigationService.GoForward()
        End If
    End Sub


    Private Sub GetProductDetail()
        Dim productID As String
        Dim svcContext As DataServiceContext

        svcContext = New DataServiceContext(New Uri("AdventureWorks.svc", _
                UriKind.Relative))

        If (Me.NavigationContext.QueryString.ContainsKey("ProductId")) Then
            productID = Me.NavigationContext.QueryString("ProductId")
        Else
            productID = App.Current.Resources("FeaturedProductID").ToString()
        End If

        svcContext.BeginExecute(Of Product)(New Uri("Product(" + productID + ")", _
                UriKind.Relative), AddressOf loadProductCallback, svcContext)
    End Sub
    Private Sub loadProductCallback(ByVal asyncResult As IAsyncResult)
        Dim context As DataServiceContext
        context = asyncResult.AsyncState
        ListBox1.DataContext = context.EndExecute(Of Product)(asyncResult)
    End Sub

End Class

C#

复制代码

public partial class ProductDetail : Page
{
    public ProductDetail()
    {
        InitializeComponent();
    }

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        GetProductDetail();
        SetButtonVisibility();
    }

    private void SetButtonVisibility()
    {
        if (NavigationService.CanGoBack)
        {
            BackNavButton.Visibility = Visibility.Visible;
        }
        else
        {
            BackNavButton.Visibility = Visibility.Collapsed;
        }

        if (NavigationService.CanGoForward)
        {
            ForwardNavButton.Visibility = Visibility.Visible;
        }
        else
        {
            ForwardNavButton.Visibility = Visibility.Collapsed;
        }
    }

    private void BackNavButton_Click(object sender, RoutedEventArgs e)
    {
        if (NavigationService.CanGoBack)
        {
            NavigationService.GoBack();
        }
    }

    private void ForwardNavButton_Click(object sender, RoutedEventArgs e)
    {
        if (NavigationService.CanGoForward)
        {
            NavigationService.GoForward();
        }
    }

    private void GetProductDetail()
    {
        string productID;
        DataServiceContext svcContext = 
            new DataServiceContext(new Uri("AdventureWorks.svc", UriKind.Relative));

        if (this.NavigationContext.QueryString.ContainsKey("ProductId"))
        {
            productID = this.NavigationContext.QueryString["ProductId"];
        }
        else
        {
            productID = App.Current.Resources["FeaturedProductID"].ToString();
        }

        svcContext.BeginExecute<product>(new Uri("Product(" + productID + ")", 
            UriKind.Relative), loadProductCallback, svcContext);
    }

    private void loadProductCallback(IAsyncResult asyncResult)
    {
        DataServiceContext context = asyncResult.AsyncState as DataServiceContext;

        ListBox1.DataContext = context.EndExecute<product>(asyncResult);
    }
}</product></product>

外部导航

应用程序可以提供指向其他网页的直接链接。外部导航可用于提供对应用程序外部资源的访问。还可以将外部导航用于 Silverlight 来实现控件（如用于普通网页的边栏菜单）。

在某些情况下，可能需要对应用程序禁止任何外部导航。若要禁用所有外部导航，在初始化 Silverlight 插件时，应将 enableNavigation 属性设置为 none。有关更多信息，请参见 EnableNavigation（Silverlight 插件对象）。

若要启用对其他网页的用户导航，可以使用 HyperlinkButton 控件并将 NavigateUri 属性设置为外部资源，将 TargetName 属性设置为打开新的浏览器窗口。

下面的代码示例演示如何使用 HyperlinkButton 导航到应用程序外的某个位置。

XAML

复制代码

<hyperlinkbutton navigateuri="http://www.microsoft.com" content="Go to Microsoft" targetname="_new"></hyperlinkbutton>

请参见

参考

Frame

Page

UriMapper

UriMapping

NavigationState

其他资源

应用程序模型

EnableNavigation（Silverlight 插件对象）