Windows 7 UI有很多令人兴奋的元素,例如:全新的任务栏,或者跳转列表,视觉体验本身并不属于应用程序的范畴,但是它是应用程序体验的重要组成部分。作为一个 WPF开发者,你可以把那些元素添加到你的Windows7应用程序中,随心所欲地定制它们在主窗口内部和外部的行为。
使用WPF4,你几乎可以访问所有的Windows 7 UI特性。WPF4内置了对Windows7任务栏的支持,其中包括可以自定义的缩略图预览,通过进度条和“图标覆盖”(icon overlay)从任务栏获得视觉反馈,以及可以自定义的跳转列表。虽然这些特性最终是通过Windows 7的原生API来提供的,但是WPF用托管的代码对它们进行了封装,通过WPF类的形式把它们暴露出来。这意味着你可以在XAML中创建跳转列表对象和其 他的UI对象,并且可以通过许多依赖属性(dependency property)来绑定它们。
Visual Studio 2010本身就包含许多和WPF有关的新特性,其中包括一个全新的可视化设计器,拖放式的数据绑定,以及在XAML中的标记扩展的智能感知。这些特性已经 和WPF的任务栏类整合到一起了,它们可以让你充分地利用Visual Studio的最新版本的全部功能,来构建时尚的Windows7应用程序。
虽然WPF4对任务栏有很好的支持,但是,还有一些其他方面的Windows 7 API它并没有封装。例如:Windows7样式的通用对话框。你只能使用Windows API Code Pack和一个外部的托管封装库在WPF中访问这些API。Windows API Code Pack有它自己的一套shell和任务栏类,在WPF 3.5 SP1中也可以使用它们。
(Windows API Code Pack的下载地址:http://code.msdn.microsoft.com/WindowsAPICodePack)
数据绑定和Visual Studio 2010的WPF设计器
在接触Windows7的新特性以前,让我们先来看一看在全新的Visual Studio 2010的WPF设计器中的一个基础的数据驱动的WPF应用程序。在Visual Studio 2010中,你可以在设计的时候通过把数据源拖放到可视化的设计器中的方式来创建数据绑定。
如果你把一个数据源项拖放到一个现有的控件上(例如,把一个文本字段拖放到一个文本框中),那么设计器会为那个数据源创建一个窗口资源,然后把这个 字段绑定到那个控件上。如果你把一个数据源项拖放到一个容器上,那么设计器会创建一个相应的绑定控件,然后把这个控件添加到那个容器中。如果默认的类型并 不合适,你可以自己设置这个绑定控件的类型。在截图1中,我把一个来自于AdventureWorks 2008样例数据库的数据表拖放到一个窗口中,设计器自动地创建了一个数据网格控件。当我们开发在Windows7任务栏上显示进度的功能的时候,我们将 会用到这个数据网格。
(截图1:把一个表数据源拖放到主窗口上,会生成了一个数据网格控件)
除了基础的创建之外,我们还做了一点额外的工作,我们使用渐变式的画刷来设置窗口的背景。Visual Studio 2010内置了一个可视化的画刷编辑器,这让创建和使用渐变式的画刷,图像画刷,以及纯色的画刷变得更加容易了。在一个画刷属性的属性编辑器上下拉可以直 接在编辑器中看到反馈,这可以让你以可视化的方式创建渐变式的画刷,或者为一个图像画刷选择一个图像。
(截图2:使用可视化的画刷编辑器创建一个背景画刷。)
和Windows7的任务栏进行交互
在Windows7中,你可以通过一个横跨任务项背景的进度条,在任务栏上显示需要长时间才能完成的操作的进度。Internet Explorer使用任务栏进度条来跟踪文件的下载情况就是一个很好的例子。
你可以通过TaskbarItemInfo类和Windows7的任务栏进行交互,在主窗口上,这个类是通过一个依赖属性暴露出来的。你可以在XAML中创建一个TaskbarItemInfo对象:
- <Window.TaskbarItemInfo>
- <TaskbarItemInfo x:Name="TaskbarItemInfo1" Description="Customer Browser: Using WPF 4 on Windows 7”>
- </TaskbarItemInfo>
- </Window.TaskbarItemInfo>
你可以直接在XAML中编辑TaskbarItemInfo的属性,也可以通过Visual Studio的属性编辑器来编辑TaskbarItemInfo的属性。这个XAML代码片段只展示了名字和Description属性,这个属性用来指 定在任务栏上显示的提示文本。大多数的任务栏特性都可以通过这个类来访问。
为了显示进度条,你只需设置其中两个属性就可以了,这两个属性分别是:ProgressValue 和 ProgressState。ProgressState的默认值是None;你可以把它设置成Indeterminate来显示一个滚动样式的进度条, 或者也可以把它设置成Normal,实际上我们就是这样设置的,这样可以显示一个标准的进度条:
- TaskBarItemInfo1.ProgressValue = 0;
- TaskBarItemInfo1.ProgressState = TaskbarItemProgressState.Normal;
把ProgressValue设置成1.0会显示一个处于完成状态的进度条。为了跟踪数据表的填充情况,我们首先会执行一个计数查询,计算出这个数 据表的总行数,把这个数值作为完成状态的进度值。然后,我们可以订阅这个数据表的RowChanged,添加下面这两行代码来更新任务栏上的进度条:
this.rowsUpdated++;
TaskbarItemInfo1.ProgressValue =((double)this.rowsUpdated)/this.rowCount; //将this.rowsUpdated显式转换为double类型,防止计算的过程中发生精度丢失。
除了进度条,你还可以使用“图标覆盖”(icon overlay)来提供和应用程序状态有关的反馈。一个“图标覆盖”是一个小的图像,在任务栏中,它位于主应用程序图标的前面。我们将会使用一个“图标覆盖”来显示我们的客户列表的过滤器设置。
截图3展示了一个在任务栏上使用“图标覆盖”的样例应用程序。在主应用程序中,你可以通过在一个组合框中选择一个国家的方式,按照国家来查看客户。 如果对过滤器进行了设置,任务栏图标会显示一个小的图像,这个小图像是在过滤器中选择的那个国家的国旗,它就是一个“图标覆盖”。
(截图3:通过一个“图标覆盖”来显示过滤器设置的Customer Browser应用程序。)
你可以通过给TaskbarItemInfo的Overlay属性指定图像源的方式来设置一个“图标覆盖”。对于这个例子来说,我针对每个国旗图像创建了一个位图资源。然后,当对过滤器进行设置的时候,我们可以从窗口资源载入图像,设置一个“图标覆盖”:
- string resourceKey = “flag_” + countryName;
- TaskbarItemInfo1.Overlay =(ImageSource)this.TryFindResource(resourceKey);
自定义缩略图
当你的应用程序运行在Windows7上的时候,应用程序缩略图预览是你可以免费获得的UI perk之一。Windows 7可以通过在任务栏上弹出一个小窗口的方式来显示主应用程序窗口的缩略图。用户可以使用缩略图预览来激活或关闭这个应用程序,或者在应用程序实例之间进行 选择。
通过TaskbarItemInfo的ThumbnailClipMargin属性,你可以很容易地对你的应用程序的缩略图进行定制。使用这个属性,你可以在主窗口内指定一个矩形(这个矩形的内容会显示在缩略图中),而不是显示整个主窗口。
ThumbnailClipMargin是一个依赖属性(dependency property),所以,除了指定一个静态的边框之外,你还可以把它绑定到另外一个控件的边框上,使用那个控件作为应用程序预览。通过这种方法,我把缩 略图预览设置成只显示客户的数据网格。与其看另外一个代码片段,到不如看一看Visual Studio中的情况。
(截图4:设置ThumbnailClipMargin绑定。)
截图4展示了在XAML中设置绑定,它还展示了Visual Studio提供的全新的标记扩展的智能感知。我们必须把绑定Path设置成“Margin”,我们可以在选项列表中选择Path。
缩略图预览还可以包含一组工具栏按钮,让用户通过预览窗口直接给应用程序发送命令。有时这些特性会比较有用,例如,发送媒体命令(例如:播放或暂停)的时候。对于这个例子来说,我创建了一个“Copy”工具栏按钮,从一个TextBox拷贝客户的电子邮件地址。
TaskbarItemInfo包含一个叫作“ThumbButonInfos”的集合属性,通过这个属性,你可以创建一个缩略图工具栏。 Visual Studio 2010也完全支持这个特性,你可以在集合编辑器中编辑每个按钮项,或者,你也可以直接在XAML中完成这个工作。
一个ThumbButonInfo的XAML通常会指定要发送的命令,命令的目标,这个按钮要使用的图像,以及工具提示文本。这是我们的“Copy”按钮的XAML代码:
- <ThumbButtonInfo Command="ApplicationCommands.Copy"
- Description="Copy E-Mail Address"
- ImageSource="/wpf4example;component/Images/copy.png"
- CommandTarget="{Binding ElementName=textBox1}" />
通过WPF命令的“魔力”,这个按钮会根据是否在文本框中选择了文本而自动地启用或禁用。
(截图5:自定义缩略图图像(只显示DataGrid)和“Copy”工具栏按钮)
跳转列表
跳转列表是常用的任务或与一个应用程序相关的文件的列表,右键单击任务栏图标,它就会弹出来,或者,在开始菜单的应用程序项上,它也会弹出来。你可以通过添加文件,任务,或者你自己的任务分类的方式来对你的应用程序的跳转列表进行定制。
跳转列表是和应用程序本身相关联的,而不是和具体的应用程序实例相关联。你可以使用程序代码,在你的应用程序中添加一个自定义的跳转列表,或者,你也可以在XAML中(在app.xaml文件中)把一个跳转列表挂载到一个应用程序对象上。
- <JumpList.JumpList>
- <JumpList ShowRecentCategory="True”
- ShowFrequentCategory="True">
- <JumpTask Title="Notepad”
- Description="Run Notepad"
- ApplicationPath="c:\windows\notepad.exe"
- IconResourcePath="c:\windows\notepad.exe"/>
- </JumpList>
- </JumpList.JumpList>
如果你在XAML中创建了一个跳转列表,在这个应用程序初始化以后,这会自动地应用到Windows Shell中。
跳转列表可以包含跳转任务(就像在这个XAML代码片段中展示的那样),来启动其他的程序,或者,它们也可以包含跳转路径,直接链接到文件。如果你的应用程序注册为某种文件类型的处理程序,那么这些跳转路径只能显示在你的跳转列表上。
Windows Shell为每个应用程序维护了一个最近频繁使用的文件的列表。你可以设置ShowRecentCategory 和 ShowFrequentCategory属性,在应用程序的跳转列表中显示这些列表。
除了这些标准的分类外,你还可以创建自定义的分类。下面这段代码添加了一个链接到calc.exe的跳转任务,然后把它放到一个自定义的分类中。
- JumpTask jumpTask1 = new JumpTask();
- jumpTask1.ApplicationPath =
- "C:\\windows\\system32\\calc.exe";
- jumpTask1.IconResourcePath =
- "C:\\windows\\system32\\calc.exe";
- jumpTask1.Title = "Calculator";
- jumpTask1.CustomCategory = "Calculation";
- JumpList jumpList1 = JumpList.GetJumpList(App.Current);
- jumpList1.JumpItems.Add(jumpTask1);
- jumpList1.Apply();
(截图6:一个带有标准分类和一个自定义分类的跳转列表)
Windows7的对话框和控件
WPF并没有封装Windows7的通用文件对话框API。要使用这些API,你可以求助于Windows API Code Pack。这个代码包可以让你从WPF应用程序中启动一些“了解”Windows 7的Shell特性(例如已知的文件夹和库)的,通用的对话框。
要使用这个代码包,需要创建一个代码包解决方案,然后把代码包程序集的引用添加到你的应用程序中。这样的话,你就可以使用代码包命名空间中的类了,包括CommonDialog。
Windows7有一系列已知的文件夹(例如:Desktop, Pictures Library),在CommonDialog中,你可以直接指定这些文件夹,无需指定具体的文件路径。这段代码把打开文件对话框的初始路径设置成了Pictures Library。
- CommonOpenFileDialog dlg = new CommonOpenFileDialog();
- dlg.InitialDirectoryShellContainer = (ShellContainer)KnownFolders.PicturesLibrary;
你可以使用已知的文件夹(或者,更普遍点来说,你可以使用Shell对象)来指定通用的打开文件对话框或保存文件对话框的一些设置。例如,这行代码给这个打开文件对话框添加了一个新的打开路径:Video Library
- dlg.AddPlace((ShellContainer)KnownFolders.VideosLibrary,FileDialog.AddPlaceLocation.Bottom);
(截图7:一个带有自定义的打开路径的Windows7打开文件对话框)
Windows API Code Pack还提供了一个用WPF封装的ExplorerBrowser控件,通过它,你可以在一个Windows7样式的资源管理器界面中显示文件和其他的Shell对象。要使用这个控件,你需要做的所有事情就是在XAML中声明它:
- <WindowsAPICodePackPresentation:ExplorerBrowser x:Name=”explorerBrowser1”/>
然后,在这个基础控件上调用Navigate方法,在你的窗口中显示选定的文件夹:
- explorerBrowser1.ExplorerBrowserControl.Navigate((ShelObject)KnownFolders.SampleMusic);
(插图8:Windows API code pack中的ExplorerBrowser控件,它运行在一个样例应用程序窗口中。)
新的工具支持新的UI
在WPF4,Windows API code pack,和完整的Visual Studio 2010 UI的帮助下,你可以把最酷的,原生的Windows7特性发挥得淋漓尽致,而且根本不用离开托管代码。对于开发者来说,这是一次重大的胜利,希望这可以 提升他们的应用程序的Windows7用户体验。