【IT168 技术文档】WPF是微软新一代图形系统，运行在.NET Framework 3.0架构下，为用户界面、2D/3D 图形、文档和媒体提供了统一的描述和操作方法。基于DirectX 9/10技术的WPF不仅带来了前所未有的3D界面，而且其图形向量渲染引擎也大大改进了传统的2D界面，比如Vista中的半透明效果的窗体等都得益于WPF。 程序员在WPF的帮助下，要开发出媲美Mac程序的酷炫界面已不再是遥不可及的奢望。 WPF相对于Windows客户端的开发来说，向前跨出了巨大的一步，它提供了超丰富的.NET UI 框架，集成了矢量图形，丰富的流动文字支持flow text support，3D视觉效果和强大无比的控件模型框架。
传统的导航是基于URI字符串的。导航到指定的URI，系统就会加载并呈现关联的页。结构化的导航则与这种方式不同，是基于对象调用PageFunction。若需要导航，您要创建适当的页功能的对象，并导航到该对象。系统不是加载和生成指定的页，而是初始化页功能对象，这个对象会控制下一步发生的动作。
在这个实验中，您将学习如何创建一个向导，这个向导用来将联系人添加到您的通讯簿里。您将使用Window和一些Page Functions，通过线性的拓扑结构，实现一个结构化的导航UI。
系统自动利用导航历史(日志)来记录导航信息。要从当前的页功能对象返回到之前的页功能对象，您需要调用OnReturn这个方法。系统会把堆栈里之前的页功能对象返回给您。有了这个特性，您可以从应用程序的某个页面很容易地返回到之前的页面，也可以在页面之间传递数据。
“添加新联系人”向导
1. 我们的添加联系人向导AddContactWizard将由两个UI页面和一个调用页面组成。在向导结束后，数据会被返回给初始页面。首先要做的在MainWindow.xaml.cs里实现LaunchNewContactWizard这个事件处理函数，把AddContactWizard显示在屏幕的中间。
// Triggered when context menu or other toolbar option is clicked to launch
// 'Add new contact' wizard dialog
//
private void LaunchNewContactWizard(object sender, RoutedEventArgs e)
{
// for the Add Contact Wizard, lets start with a
// Navigation Window
NavigationWindow addContactWizard = new NavigationWindow();
addContactWizard.Title = "Contact Information";
addContactWizard.Width = 500;
addContactWizard.Height = 400;
addContactWizard.WindowStyle = WindowStyle.ToolWindow;
addContactWizard.Name = "AddContactWizard";
// point it to the initial page function with no UI
// this will call the subsequent page functions which have UI
addContactWizard.Source = new Uri("UILessPageFunction.xaml",
UriKind.Relative);
Application.Current.Properties["AddContactWizard"]
= addContactWizard;
addContactWizard.WindowStartupLocation
= WindowStartupLocation.CenterScreen;
addContactWizard.ShowDialog();
}
导航窗口的源设置为了UILessPageFunction.xaml，我们稍后会创建这个页面。我们在应用的属性包里引用了窗口对象，这样这个窗口对象可以在控制窗口功能的其它地方被使用。
2. 接下来我们来定义初始页面。我们要使用PageFunction，但不会添加UI。在您的项目里，添加一个新的WPF Page Function，命名为UILessPageFunction.xaml。您可以通过Solution Explorer，右键点击项目，选择Add?New Item，在对话框中选择PageFunction(WPF)。
TypeArgument指定的是调用页面会返回什么样的PageFunction。让我们修改标记语言，将类型参数设为Object。稍后我们会在代码文件中修改同样的类型参数。
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
x:TypeArguments="sys:Object"
Title="UILessPageFunction">
</PageFunction>
3. 在之前我们创建了一个叫做UILessPageFunction的功能页面，它本身并没有子元素，它会作为向导UI的调用页面。
下面我们会创建两个有UI的PageFunctions。第一个叫ContactDetailPage1。这个页面上会有一些输入框，可以输入联系人的姓名，email地址，和主页URL。这次我们在标记语言中把类型参数的默认值String改成Object。
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
x:Class="AddressBook.ContactDetailPage1"
x:TypeArguments="sys:Object"
xmlns:c="Lab"
Title="Contact Details - 1">
<Grid Name ="RootGrid"
VerticalAlignment="Center"
HorizontalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<!-- Labels go here -->
<TextBlock Width="200" Height="30" Grid.Column="0" Grid.Row="1" >
First Name
</TextBlock>
<TextBlock Width="200" Height="30" Grid.Column="0" Grid.Row="2" >
Last Name
</TextBlock>
<TextBlock Width="200" Height="30" Grid.Column="0" Grid.Row="3" >
</TextBlock>
<TextBlock Width="200" Height="30" Grid.Column="0" Grid.Row="4" >
Home Page
</TextBlock>
<!-- Input fields -->
<TextBox Name="txtFirstName" Width="200" Height="30"
Grid.Column="1" Grid.Row="1"
Text="{Binding Path=FirstName, Mode=TwoWay}"/>
<TextBox Name="txtLastName" Width="200" Height="30"
Grid.Column="1" Grid.Row="2"
Text="{Binding Path=LastName, Mode=TwoWay}"/>
<TextBox Name="txtEmailAddress" Width="200" Height="30"
Grid.Column="1" Grid.Row="3"
Text="{Binding Path=EmailAddress, Mode=TwoWay}"/>
<TextBox Name="txtHomePage" Width="200" Height="30"
Grid.Column="1" Grid.Row="4"
Text="{Binding Path=HomePage, Mode=TwoWay}"/>
<Button Name="btnHomePage" Width="200" Height="30"
Grid.Column="1" Grid.Row="4"
Content="{Binding Path=HomePage, Mode=TwoWay}"
Click="NavigateToHome"/>
<Button Name="btnEmailAddress" Width="200" Height="30"
Grid.Column="1" Grid.Row="3"
Content="{Binding Path=EmailAddress, Mode=TwoWay}"
Click="SendEmail"/>
<!-- Navigation buttons -->
<DockPanel Name="ButtonPanel1" Grid.Column="0" Grid.Row="5" >
<Button Name="btnNext" Width="100" Height="30"
Click="OnNextClick">Next</Button>
<Button Name="btnCancel" Width="100" Height="30"
Click="OnCancelClick">Cancel</Button>
</DockPanel>
<DockPanel Name="ButtonPanel2" Grid.Column="1" Grid.Row="5">
<Button Name="btnFinish" Width="100" Height="30"
Click="OnFinishClick">Finish</Button>
</DockPanel>
</Grid>
</PageFunction>
请注意，每个输入框都绑定到联系人对象的某个属性。另外有三个按钮来处理导航事件：Next，Cancel，和Finish。
