逐步使用 Silverlight 5 Beta 中的 ImplicitDataTemplate

• 下载演示 - 31.31 KB

引言

ImplicitDataTemplate 是 Silverlight 5 中的一项新功能。使用 ImplicitDataTemplate，您可以为控件声明多个 Data Template，并且可以根据数据类型自动加载适当的数据模板。

在本文中，我们将通过一个好的示例分步讨论它。请阅读完整文章以深入了解。如果您有任何疑问，请告诉我。随时欢迎反馈。

让我们快速分析一下我们想实现的目标，以展示此功能。假设我们有一个组织，我们既有员工也有客户，他们都与该组织相关。现在，我们需要存储员工和客户的记录。最后，我们需要以适当的方式显示这些记录。

为了演示，我们将创建一个 ListBox，并在其中指明该人是 employee 还是 customer。这个简单的例子将帮助您非常轻松地理解此功能。

必备组件

在开始讨论其余主题之前，您需要设置您的开发环境。您需要 Visual Studio 2010 SP1，以及 Visual Studio 2010 的 Silverlight 5 Beta 工具。之后，您需要创建一个新的 Silverlight 项目。

查找以下帖子，它们将回答您的所有疑问并帮助您设置先决条件

1. 在您的开发环境中安装 Silverlight 5 Beta。您可以将其与现有的 Silverlight 版本并排安装。
2. 不熟悉 Silverlight 5？这篇文章将帮助您 创建您的第一个 Silverlight 5 项目。

一旦您的开发环境设置妥当，请进入下一步开始讨论主要主题。别忘了在文章末尾提问。

设置解决方案

在我开始用分步示例描述此功能之前，我们需要以正确的方式设置解决方案。创建项目后，请以 MVVM 的方式创建目录结构。请记住，MVVM 结构不是使用此功能所必需的，但我更喜欢在 MVVM 模式下工作。

在解决方案资源管理器中，首先创建文件夹结构。对于我们基于 MVVM 的示例，我们将创建 "Models"、"Views"、"ViewModels" 和 "Services" 文件夹，如下所示：

文件夹结构完成后，让我们在适当的位置创建类和 XAML。在 Views 文件夹中添加 MainView.xaml，在 ViewModels 文件夹中添加 MainViewModel.cs，在 Services 文件夹中添加 DataService.cs，并在 Models 文件夹中添加一个名为 IPerson.cs 的接口。现在，在同一个 Models 文件夹中创建两个名为 "Customer.cs" 和 "Employee.cs" 的类，并让它们实现 IPerson 接口。在 IPerson 接口中公开一些属性，并在 Customer 和 Employee 类中实现它们。

完成后，构建您的项目并修复遇到的任何问题。

接口实现

让我们在接口中声明一些名为 Firstname、Lastname 和 Age 的属性。以下是实现的相同内容：

您可以从此处下载接口文件： IPerson.cs。

模型实现

接口准备好后，让我们也在我们的契约类中实现接口属性。它们看起来如下：

您可以从此处下载契约类： Employee.cs 和 Customer.cs。

实现 DataService

您需要一个 DataService 来返回 Person 详细信息。Person 可以是 Employee 或 Customer。假设我们在这一步从数据库中获取并返回给客户端。这里我们将硬编码集合并将其返回。我们在集合中添加了几个 Employee 和几个 Customer。由于这两个类的基接口都是 IPerson ，因此我们可以轻松地将它们添加到集合中。在此处找到代码片段：

供您参考，您可以从此处下载 DataService 类： DataService.cs。

实现 ViewModel

让我们开始在 ViewModel 上编写代码。在其中实现 INotifyPropertyChanged 接口，这样，一旦任何属性发生更改，它将自动通知视图以刷新该属性。现在创建一个名为 "Persons" 的属性，类型为 ObservableCollection<IPerson>，如下所示。在构造函数中，调用 DataService 的 GetPersons() 方法，并将数据记录存储在名为 "Persons" 的属性中。

您可能需要下载 MainViewModel.cs 文件。从此处下载： MainViewModel.cs。 

视图实现

现在是创建视图并将集合绑定到 listbox 的时候了。首先，添加 Model 和 ViewModel 的命名空间，如下所示。我们将在绑定数据时需要它们。现在，在 UserControl.Resources 中，将 MainViewModel 添加为 StaticResource。

添加一个 ListBox，并将 ListBox 的 DataContext 设置为 MainViewModel 实例。此外，将 ListBox 的 ItemsSource 属性绑定到 MainViewModel 中存在的 Persons 集合。

这是我们创建它的方式：

完成后，再次构建您的项目并修复任何错误。

以旧方式创建 DataTemplate

让我们以使用 DataTemplate 的旧式 DataBinding 方式思考。我们可以将其创建在 Resource 字典中，并将绑定设置为实际控件中的 StaticResource ，或者，我们可以直接在控件内添加模板。这两种方式相似。为了更容易理解，我们采用第二种方法。

在添加 DataTemplate 之前，我们需要先添加 ListBox 的 ItemTemplate 。在 DataTemplate 内部，我们创建要显示的模板，并在显示任何内容之前进行适当的数据绑定。

这是实现它的旧方法：

请注意，如果我们运行应用程序，此处将看到相同的输出。因为我们有一个用于显示它们的单一 DataTemplate 。我们无法根据数据类型为控件添加多个 DataTemplates。哦！！！替代方法是创建两个或更多 DataTemplates，并根据数据类型从代码隐藏动态加载它们。但这也不能解决我们的问题。使用此方法，您无法将不同数据类型的项混合在单个控件中。您需要从代码隐藏处理，这非常棘手。

那么，如何以一种简单有效的方式处理这个问题呢？微软最近推出了 Silverlight 5 Beta，它具有一项称为 ImplicitDataTemplates 的功能。我们的文章标题也与此主题相同。使用此功能，您可以轻松地以正确的方式完成此操作。如何操作？现在就开始使用此功能，并非常清楚地理解它。

创建隐式数据类型

使用隐式数据类型，您可以为单个控件实例使用多个数据模板，并相应地以适当的方式显示数据。我们将使用与上一个示例中相同的 DataTemplate。

如果您已在 ListBox 中添加了现有的 DataTemplate，请将其删除。现在，在资源字典中，将相同的模板复制两次，并相应地更改显示文本。在我们的第一个模板中，我们将设置为 Employee ，在第二个模板中，我们将设置为 Customer。

根据新功能指南，您需要指定 DataTemplate 的 DataType 。对于第一个模板，将 DataType 属性设置为 Employee ，对于第二个模板，使用 Customer 作为 DataType 属性。

请看下面的代码片段，以便很容易理解：

在此处下载完整的 XAML 代码： MainView.xaml。

演示

现在是时候实际看看并理解实际行为了。让我们构建并运行应用程序。您会注意到它为正确的数据类型使用了正确的 DataTemplate 。检查我们从 DataService 收到的集合，并与 UI 中的数据进行匹配。您会发现它们是相似的。

由此，我们可以理解它根据数据类型从资源中加载正确的 DataTemplate 。无需直接将模板绑定到控件。只需将其放在资源字典中，它就会根据数据类型直接从那里拾取。

下载

完整的源代码可作为可下载的 ZIP 文件获得。在此处下载： Silverlight 5 Beta, Implicit Data Template 源代码。请记住，源代码基于 Silverlight 5 Beta 版本。它可能在 Silverlight 5 的未来版本中有效，也可能无效。

What Next?

最后但同样重要的是，我一直欢迎您对我的文章提出反馈。请在文章末尾添加一些评论，以支持我提供更好的内容给您。感谢您阅读我的文章并访问我的博客。我也会发推文。请在 Twitter 上关注我 @kunal2383。

历史

• 2011年5月8日，初始版本