本篇文章是Barry Lapthorn创作的，感觉写得很好，翻译一下，做个纪念。由于英文水平实在太烂，所以翻译有错或者译得不好的地方请多指正。另外由于原文是针对WPF的，我在原文的基础上做了一些修改，让例子能在silverlight上运行。

原文链接：

简介

假设你对C++有很好的理解，也对C#有适当的了解，那么准备开始WPF学习将不会太困难。我在六个月前开始着手于WPF，然后可能在谷歌搜索中导致了一个结果，我最后开始明白并且开始使用WPF进行生产（我是否错过了这条船，是另一天的另一个故事了）。

就像学习任何新技术一样，事后你将从中得到益处，在我看来，几乎我所遇到的所有的WPF教程都有以下几个方面的不足：

例子全是WPF里面的

例子缺少关键的注释，事实上你自己制作一个更容易

例子试图炫耀WPF的能力，大量的毫无意义的结果，对你没有任何帮助

例子使用的类名中有些属性似乎和框架关键字或类名太相似，因此很难在xaml代码中作为用户定义的标示符来使用（ListBoxGroupStyle的名称很让初学者头疼）。

为了解决这个问题，基于在谷歌上输入“WPF 教程”得到的第一条结果我写下了这篇文章。这篇文章可能不是100%正确，或者甚至是做事情的“唯一正确的方法”，不管怎么样它将阐明一些主要的点，这些点是我在六个月前希望发现的。

我将快速的介绍一些主题，然后展示一个例子来解释或演示每一个观点。因此，我事实上没有试图使GUI更漂亮，因为这不是这篇文章的要点（参见上面的要点）。

因为这个教程相当长，为了简洁我将省略许多代码，因此请下载附加的ZIP文件，然后看里面的例子（.NET4.0/VS2010）。每一个例子都是建立在前一个例子上的。

基本要素

WPF最给力的就是数据绑定，简单的说，你有一些数据，按照某种特征分类放在一个集合里，然后你想将它显示给用户。你可以将数据“绑定”到xaml代码。

WPF有两个部分，xmal描述你的GUI布局和效果，这个后台代码是绑定到xaml的。

一种最优雅的和最大可能被复用的方式来组织你的代码的方法是使用"MVVM"模式：模型，视图，，视图模型。

你需要知道的关键点

存储数据你应该使用的集合是ObservableCollection<>。而不是list，也不是dictionary，而是 ObservableCollection。“Observable”这个词在这里是为这种情况提供：WPF窗口需要能观察到你的数据集合。这个集合类实 现了WPF使用的几个接口。

每一个WPF控件（包括“窗口”）都有一个“DataContext”，集合控件都有一个“ItemsSource”属性用于绑定。

“INotifyPropertyChanged”接口将被广泛的的用于GUI和你的代码之间的通信，当数据有任何改变的时候。

例1：错误的做法

开始的最好方法是从例子开始，我们将从一个song类开始，而不是通常的person类，我们可以将歌曲整理到专辑里面，或者是一个大的集合里，或者按艺术家来整理。一个简单的song类应该会像下面这样：

View Code

在WPF术语中，这个叫“模型”，GUI是“视图”。不可思议的是“视图模型”，通过数据绑定将它们绑在一起，它真的是一个很好的适配器能将模型变成某种WPF框架可以使用的东西。所以只是重复一下，这就是“模型”。

自我们创建Song作为引用类型以后，由于副本在内存上很便宜，我们可以非常容易的创建SongViewMode。我们首先需要考虑的是，什么是我 们（潜在的）需要显示的？假如我们只关心歌曲的艺术家名称，而不关心歌曲的标题，那么SongViewModel可以向下面这样定义：

View Code

只不过这不是十分正确的。由于我们在ViewModel里暴露了一个属性，我们显然会想使在代码里改变的歌曲的艺术家名称自动的显示在GUI上，反之亦然：

View Code

请注意，在所有的例子里面，我们都创建了视图模型的“声明”，例如，我们在xaml代码里这样做：

View Code

这等价于在后台代码MainWindo.cs里这样做：

View Code

然后移除xaml中的DataContext元素：

View Code

这是运行结果：

点击更新按钮不会进行任何更新，因为我们没有实现数据绑定。

数据绑定