Silverlight技术：导航框架与媒体集成详解

# Silverlight技术：导航框架与媒体集成详解 ## 1. 导航框架概述 Silverlight 3引入了导航框架，用于将不同的XAML页面连接在一起，形成一个完整的应用程序。该框架不仅支持像浏览器一样的前后导航功能，还涵盖了如何将独立的XAML页面组合成应用程序的更广泛概念。Silverlight 4进一步增强了导航框架，允许开发者使用自定义方案从URI生成和初始化页面实例，并支持诸如身份验证重定向、错误页面以及Model - View - ViewModel Controller风格的导航等场景。 导航框架的重要组成部分包括： - **Frame类**：负责导航操作。 - **Page类**：可进行导航的用户控件。 - **URI映射**：简化页面引用。 - **日志**：记录导航历史。 - **与浏览器前后按钮的集成**：提供一致的用户体验。 导航框架位于`System.Windows.Navigation`命名空间，支持控件位于`System.Windows.Controls`命名空间，在新的Silverlight 3和Silverlight 4应用程序中会自动添加引用。 ### 1.1 Frame类 Frame类负责显示导航目标页面（实际上可以是任何用户控件，因为Page类继承自UserControl）。以下是Frame类的属性、方法和事件： #### 1.1.1 属性 | 属性 | 类型 | 描述 | | --- | --- | --- | | CacheSize | int | 定义框架可缓存的页面数量。仅当Page类的`NavigationCacheMode`属性为`Enabled`时可用。 | | CanGoBack | bool | 如果导航日志中有当前活动条目之前的条目，则返回true。 | | CanGoForward | bool | 如果导航日志中有当前活动条目之后的条目，则返回true。 | | ContentLoader | INavigationContentLoader | 定义负责提供与请求的URI对应的内容的对象。 | | CurrentSource | Uri | 存储当前显示内容对应的URI，仅在导航完成后更新。 | | JournalOwnership | JournalOwnership | 控制日志的行为，可能的值有`Automatic`（顶级框架与浏览器日志集成；否则，框架使用自己的日志）、`OwnsJournal`（框架使用自己的日志）和`UsesParentJournal`（与浏览器的日志集成；如果在非顶级框架上设置，将抛出异常）。 | | Source | Uri | 存储下一次导航的URI，与`CurrentSource`不同，其值在导航开始时设置。导航完成后，`Source`和`CurrentSource`的值将相同。 | | UriMapper | UriMapperBase | 定义一个对象，用于管理将此框架的URI转换为另一个URI。 | #### 1.1.2 方法 | 方法 | 描述 | | --- | --- | | GoBack | 如果有当前活动条目之前的日志条目，则导航到上一个日志条目；否则抛出异常。 | | GoForward | 如果有当前活动条目之后的日志条目，则导航到下一个日志条目；否则抛出异常。 | | Navigate | 导航到指定的URI。URI可以是应用程序内XAML的绝对路径或URI映射中指定的URI。 | | Refresh | 重新加载当前页面。 | | StopLoading | 停止导航请求，在导航请求触发内容下载或目标XAML的长时间创建时最有用。 | #### 1.1.3 事件 | 事件 | 描述 | | --- | --- | | FragmentNavigation | 在导航到内容片段（格式良好的内容）请求开始时发生。 | | Navigated | 在导航完成后发生。 | | Navigating | 在导航请求开始时发生。 | | NavigationFailed | 在导航尝试期间发生错误后发生。 | | NavigationStopped | 在调用`StopLoading`或通过新的导航请求中止当前导航后发生。 | ### 1.2 Page类 Page类继承自UserControl，其存在的目的是提供一个支持导航的用户控件。它提供了可重写的事件处理程序，用于根据导航进行自定义处理，还公开了一个`Title`属性，可在导航历史记录和浏览器标题栏中显示有意义的文本，并提供了访问导航服务的属性。 #### 1.2.1 属性 | 属性 | 类型 | 描述 | | --- | --- | --- | | NavigationCacheMode | NavigationCacheMode | 定义页面是否缓存的范围。`NavigationCacheMode`枚举有三个可能的值：`Disabled`表示不缓存页面，每次访问都会创建一个新的页面实例；`Required`表示无论框架的缓存大小如何，页面始终被缓存；`Enabled`表示页面仅在框架的缓存大小超过指定值之前被缓存。 | | NavigationContext | NavigationContext | 提供对Uri和查询字符串数据的访问。 | | NavigationService | NavigationService | 提供对Frame使用的`NavigationService`实例的访问。除了`JournalOwnership`外，公开与Frame相同的属性和事件。可以通过此对象从Page发起导航请求。 | | Title | String | `Title`属性的文本将显示在导航历史记录和浏览器标题栏中。如果未设置，则显示URI。 | #### 1.2.2 方法 | 方法 | 描述 | | --- | --- | | OnFragmentNavigation | 当导航到片段开始时调用。 | | OnNavigatedFrom | 当页面不再活动（导航到另一个页面已开始）时调用。 | | OnNavigatedTo | 当页面通过导航成为活动页面时调用。 | | OnNavigatingFrom | 在页面不再活动（导航到另一个页面已开始）之前调用。 | ### 1.3 导航事件顺序 Frame类和Page类之间有许多事件，提供了介入导航过程并执行自定义工作的机会。以下为导航过程中事件触发顺序： ```mermaid graph LR A[Navigating] --> B[FragmentNavigation] B --> C[Navigated] C --> D{是否成功} D -- 是 --> E[无异常] D -- 否 --> F[NavigationFailed] G[StopLoading或新导航请求] --> H[NavigationStopped] ``` ## 2. 媒体集成 Silverlight自1.0版本（代号WPF/E）推出以来，就提供了对处理图像和媒体（音频和视频）的支持。后续版本（Silverlight 2、3和4）不断改进，提供了丰富的图像、音频和视频处理功能。 ### 2.1 Silverlight 4媒体集成增强功能 - **PNG格式支持**：支持所有类型的PNG图像格式，并具有适当的透明度。 - **离线DRM支持**：通过PlayReady为OOB应用程序提供离线DRM支持，在更受保护和管理的环境中交付媒体内容。 - **网络摄像头和麦克风集成**：提供一组新的API，用于识别连接到计算机的音频和视频设备，并播放和捕获音频和视频。 - **多播流支持**：支持媒体文件的多播流。 - **Windows Azure平台支持**：基于Windows Azure平台的托管和媒体交付服务支持媒体文件的多播流。 ### 2.2 图像 Silverlight目前仅支持PNG和JPEG格式，Silverlight 4消除了对PNG格式支持的所有限制，现在所有PNG图像格式都支持适当的透明度。 #### 2.2.1 Image类 在用户界面上放置图像的最简单方法是使用Image控件，并在XAML代码中设置其`Source`属性： ```xml <Image Source="Buddy.png"/> ``` Image控件继承自FrameworkElement，以下是Image类的新属性和事件： ##### 属性 | 属性 | 类型 | 描述 | | --- | --- | --- | | Source | ImageSource | 获取或设置图像源。目前，只有`BitmapImage`类可以作为图像源。在XAML中，可以指定相对或绝对URI。 | | Stretch | Stretch | 获取或设置图像在Image控件设置的宽度/高度内的大小调整方式。 | ##### 事件 | 事件 | 描述 | | --- | --- | | ImageOpened | 当图像源下载并解码成功时触发。可用于在渲染图像之前确定图像的大小。如果图像解码失败，此事件不会触发。一旦此事件触发，`PixelHeight`和`PixelWidth`属性保证有效。 | | ImageFailed | 如果下载或渲染图像时出现问题，则触发。可能的原因包括指定地址找不到图像和图像格式不受支持。`EventArgs`类是`ExceptionRoutedEventArgs`，提供`ErrorException`（抛出的异常）和`ErrorMessage`属性。 | 在XAML中，可以使用相对或绝对地址指定`Source`： ```xml <Image Source="../Images/Buddy.png"/> ``` 也可以使用代码实现： ```csharp Image addImage = new Image(); addImage.Source = new BitmapImage(new Uri("Buddy.png", UriKind.RelativeOrAbsolute)); LayoutRoot.Children.Add(addImage); ``` #### 2.2.2 BitmapImage事件 | 事件 | 类型 | 描述 | | --- | --- | --- | | ImageOpened | - | 当图像源下载并解码成功时触发。可用于在渲染图像之前确定图像的大小。如果图像解码失败，此事件不会触发。一旦此事件触发，`PixelHeight`和`PixelWidth`属性保证有效。 | | DownloadProgress | - | 报告图像下载进度。`EventArgs`类是`DownloadProgressEventArgs`，包含一个`Progress`属性，报告0（表示图像可能正在下载）或1（表示图像已下载完成）。 | | ImageFailed | - | 当图像无法下载或图像格式无效时触发。事件处理程序传递一个`ExceptionRoutedEventArgs`实例，提供`ErrorException`（抛出的异常）和`ErrorMessage`属性。 | #### 2.2.3 Stretch属性 Image控件的`Stretch`属性控制图像在容器中的大小调整方式，有以下四个枚举值： - **None**：图像保持其原始大小。 - **Fill**：图像完全填充输出区域，可能会因不保留纵横比而出现失真。 - **Uniform**：图像填充输出区域，同时保持其纵横比，这是默认值。 - **UniformToFill**：图像缩放以完全填充输出区域，同时保持其纵横比。 ### 2.3 示例：图像查看器应用程序 以下是实现图像查看器应用程序的步骤： #### 2.3.1 定义Grid布局 ```xml <Grid x:Name="LayoutRoot" Background="White"> <Grid.ColumnDefinitions> <ColumnDefinition Width="100"/> <ColumnDefin ```