动手试验：创建 RSS 新闻阅读器

Web 源（如新闻源或播客）经常使用 XML 格式的文件来保存其内容。可以使用称为阅读器 或聚合器 的程序订阅 Web 源并进行阅读。通常，阅读器将在计算机上保持打开状态，并在 Web 源更新时用新内容进行自我更新。Web 源的最常见提供机制名为“Really Simple Syndication (RSS)”。

下列操作步骤演示了如何使用 Microsoft Expression Blend 和 RSS 源创建简单的 RSS 阅读器。RSS 阅读器可用于读取任何 XML 数据源，甚至读取本地文件或用户自己的网站上的 XML 文件。

说明：
下列操作步骤假设用户拥有有效的 Internet 连接。

说明：
Silverlight 2 不支持 XML 数据源。但是，可以从 MSDN 上的在 Silverlight 中分析 XML 数据（此链接可能指向英文页面）下找到使用 XML 数据的相关信息。

创建数据源

创建数据源

1. 在 Expression Blend 中，单击“文件”菜单上的“新建项目”，然后单击“WPF 应用程序(.exe)”。

   将创建新项目。

2. 在“项目”面板的“数据”下，单击“+XML”。

   将打开“添加 XML 数据源”窗口。

3. 在“连接名称”字段中，键入“rssDS”，然后在“XML 数据的 URL”字段中，键入 RSS 源的 URL。例如，若要创建指向 MSNBC 天气源的 XML 数据源，需要键入“http://rss.msnbc.msn.com/id/3032127/device/rss/rss.xml”。单击“确定”。

   提示：
   可以在“XML 数据的 URL”字段中使用任何 URL 或 XML 文件的本地路径。如果希望使用不同的 RSS 源，则可以通过在 Web 浏览器上打开提供者的网站（如 http://www.msnbc.com）并搜索其 RSS 源的链接来定位到相应的 URL。通常，该网站将列出可用的源以及用于订阅这些源的按钮。查找指向所需源的 XML 文件的链接。

4. 在“项目”面板的“数据”下将会添加一个名为“rssDS”的数据源。展开节点并查看数据源的不同字段。不会显示数据，而只会显示包含数据的字段名及其结构。

   此时即可将应用程序中的控件绑定到该数据。

   添加 XML 数据源之后的“数据”面板

   

返回页首

通过从“项目”面板拖动字段来绑定到数据字段

有多种方法可以将控件绑定到数据源中的项。以下过程演示了如何将数据源字段从“项目”面板拖到美工板上以创建两个新控件。或者，可以将数据源字段拖到现有控件上，以便将数据绑定到这些控件的属性。

通过从“项目”面板拖动字段来绑定到数据字段

1. 在“项目”面板的“数据”之下，依次展开“rss”、“channel”和“image”节点。将“url : (String)”节点拖动到美工板的左上角。在显示的下拉列表上，单击“Image”控件。

   将在美工板上创建一个“Image”对象，并打开“创建数据绑定”对话框。

2. “选择字段”指定要将 URL 数据项绑定到的 Image 对象的属性。默认的选定内容（“Source”）是正确的，因此请单击“确定”。

   美工板上的 Image 对象将反映从数据项的 URL 处发现的图像。使用“选择”工具 将 Image 对象拖动到美工板的左上角，并将其缩小。

   添加 Image 对象并将其绑定到 URL 数据项之后的美工板（实际图像看起来可能会有所不同）

   

3. 在“项目”面板的“数据”之下，依次展开“rssDS”、“rss”和“channel”节点。将“title : (String)”节点拖动到美工板上 Image 对象的右侧。在显示的下拉列表上，单击“Label”控件。“创建数据绑定”对话框中的“选择字段”旁边列出的默认属性（“Content”）是正确的，因此请单击“确定”。

   此时，将显示“创建数据模板”对话框。

4. 将选择“新建数据模板和显示字段”选项，并对其进行配置，以创建将在 TextBlock 控件中显示标题数据项的数据模板。单击“确定”。

   新闻源的标题将显示在美工板上的新 Label 控件中。使用“选择”工具移动并缩放 Label 对象，然后使用“属性”面板的“文本”和“画笔”类别中的属性更改文本的外观。

   说明：
   “对象和时间线”下不会显示 TextBlock 控件，这是因为 TextBlock 控件是“生成的内容”数据模板的一部分。“生成的内容”数据模板用于设计控件在绑定到数据之后的外观。有关模板的信息，请参阅创建或编辑控件模板。

   添加 Label 对象并将其绑定到标题数据项之后的美工板（实际美工板看起来可能会有所不同）

   

返回页首

使用数据上下文将多个控件绑定到同一个数据

向父对象分配数据上下文之后，可以在多个子对象中使用数据的同一个快照。如果需要创建大纲-细节 设计，这种方法非常有用。在大纲-细节设计中，单击列表（大纲窗格）中的项，就会在另一个对象（细节窗格）中显示该项的相关信息。

使用数据上下文将多个控件绑定到相同数据

1. 创建一个“网格”面板 ，该面板将覆盖图像和标题之下的区域。该网格对象将成为设置数据上下文的父对象。

2. 在“对象和时间线”下，单击新的网格对象以将其选定，然后在“属性”面板中的“公共属性”下找到“DataContext”属性。

3. 单击与“DataContext”属性关联的“高级属性选项” 按钮，然后单击“数据绑定”。

   将打开“创建数据绑定”对话框。

4. 在“数据字段”选项卡（默认选项卡）的“数据源”下，单击“rssDS”。在“字段”下，依次展开“rss”和“channel”节点，单击“item (数组)”，然后单击“完成”。

   可以将项集合从数据源分配给新的网格对象。此时，网格对象的任何子对象都可以使用项集合的同一个快照。

5. 使用“选择”工具双击新的网格对象将其激活，以便可以添加子对象。

6. 在工具箱中，选择“ListBox”控件 ，然后绘制一个占据网格左半侧的 ListBox。

7. 使用“选择”工具选择“ListBox”，然后在“属性”面板中的“公共属性”下找到“ItemsSource”属性。

   说明：
   可将“ItemsSource”属性设置为任何项集合。每次只能使用“ItemsSource”或“Items”属性中的一个。“ItemsSource”属性通常用于绑定到生成项的集合。“Items”属性可用于通过“编辑此集合中的项”按钮手动添加各个项。

8. 单击与“ItemsSource”属性关联的“高级属性选项” 按钮，然后单击“数据绑定”。

   将打开“创建数据绑定”对话框。

9. 单击“显式数据上下文”选项卡。在“字段”下，依次展开“rss”和“channel”节点，然后单击“item (数组)”。单击“定义数据模板”按钮。

   将打开“创建数据模板”对话框。

10. 选择第三个选项“新建数据模板和显示字段”（默认选项）。清除“item”旁边的复选框，以快速清除所有复选框。选中“title”旁边的复选框，然后单击“确定”。

    此时，ListBox 对象会与“item (数组)”数据建立数据绑定，并显示新闻项的列表。

    添加 ListBox 对象并将其绑定到“item (数组)”数据集合之后的美工板（实际美工板看起来可能会有所不同）

    

11. 在工具箱中，选择“TextBlock”控件 ，然后绘制一个占据网格右半侧的 TextBlock。

12. 使用“选择”工具选择该 TextBlock，然后在“属性”面板中的“公共属性”下找到“Text”属性。单击与“Text”属性关联的“高级属性选项” 按钮，然后单击“数据绑定”。

    说明：
    将文本控件添加到美工板之后，Expression Blend 就会进入该控件的编辑模式。这意味着用户可以立即在该控件中键入内容，但不能访问该控件的所有属性。若要退出控件的编辑模式，请按 Esc 或单击“选择”工具。

    将打开“创建数据绑定”对话框。

13. 单击“显式数据上下文”选项卡。在“字段”下，依次展开“rss”和“channel”节点，单击“item (数组)”，然后单击“description : (String)”。单击“完成”。

    因为 TextBlock 对象和 ListBox 对象共享相同的数据上下文，所以此时 TextBlock 对象会与 ListBox 中选定项的“description”建立数据绑定，并且会显示相应的描述。

    添加 TextBlock 对象并将其绑定到 Description 数据项之后的美工板。（实际美工板看起来可能会有所不同）

    

14. 按 F5 以运行应用程序，然后在应用程序中单击 ListBox 以更改选择项，从而阅读不同的新闻说明。

    说明：
    有些项可能会包含 HTML 文本。可以创建一个将从“Description”字符串中删除 HTML 元素的值转换器，然后可以在“创建数据绑定”对话框中应用该值转换器。有关如何创建值转换器的信息，请参阅动手试验：创建并应用值转换器。

返回页首