动手试验:创建 RSS 新闻阅读器
Web 源(如新闻源或播客)经常使用 XML 格式的文件来保存其内容。可以使用称为阅读器或聚合器的程序订阅 Web 源并进行阅读。通常,阅读器将在计算机上保持打开状态,并在 Web 源更新时用新内容进行自我更新。Web 源的最常见提供机制名为“真正简单的整合 (RSS)”。
下列操作步骤演示了如何使用 Microsoft Expression Blend 和 RSS 源创建简单的 RSS 阅读器。RSS 阅读器可用于读取任何 XML 数据源,甚至读取本地文件或用户自己的网站上的 XML 文件。
![]() |
---|
下列操作步骤假设用户拥有有效的 Internet 连接。 |
![]() |
---|
Microsoft Silverlight 不支持 XML 数据源。但是,可以从 MSDN 上的 XML 数据 下找到使用 XML 数据的相关信息。 |
创建数据源
在“数据”面板中,单击“添加实时数据源”
,然后单击“定义新的 XML 数据源”。
此时,将显示“定义新的 XML 数据源”对话框。
在“数据源名称”旁边,键入“rssDS”。
在“XML 文件路径或 URL”文本框旁边,键入“http://rss.msnbc.msn.com/id/3032127/device/rss/rss.xml”。
提示:
可以在“XML 文件路径或 URL”字段中使用任何 URL 或 XML 文件的本地路径。如果希望使用不同的 RSS 源,则可以通过在 Web 浏览器中打开提供者的网站(如 http://www.msnbc.com)并搜索其 RSS 源的链接来定位到相应的 URL。通常,该网站将列出可用的源以及用于订阅这些源的按钮。查找指向所需源的 XML 文件的链接。
在“定义位置”下,执行下列操作之一:
若要使应用程序中的所有文档都能使用该数据,请选择“项目”。
若要使数据只能由当前文档使用,请选择“此文档”。
单击“确定”。
在“数据”面板中将会添加一个名为“rssDS”的数据源。展开节点并查看数据源的不同字段。不会显示数据,但会显示包含数据的字段名及其结构。
此时即可将应用程序中的控件绑定到该数据。
添加 XML 数据源之后的“数据”面板
通过从“项目”面板拖动字段来绑定到数据字段
有多种方法可以将控件绑定到数据源中的项。以下过程演示了如何将数据源字段从“数据”面板拖到美工板上以创建两个新控件。或者,可以将数据源字段拖到现有控件上,以便将数据绑定到这些控件的属性。
在“工具”面板中,单击“资产”
。
在“资产”面板中,选择“控件”类别中的“全部”。
单击“控件”,再单击“系统控件”,然后单击“Image”控件
。
使用鼠标在美工板的左上角绘制一个图像控件,其宽度和高度均约为 100 像素。
在“数据”面板中,依次展开“rss”、“channel”和“image”节点。将“url : (String)”节点拖动到新图像对象上。
图像对象显示来自 MSNBC 网站的图像。“数据”面板在数据源周围显示一个黄色范围框,以指示数据的这部分已绑定到控件。
添加 Image 对象并将其绑定到 URL 数据项之后的美工板(实际的美工板看起来可能会有所不同)
在“数据”面板中,依次展开“rssDS”、“rss”和“channel”节点。将“title : (String)”节点拖动到美工板上图像对象的右侧。
此时将创建一个 TextBlock 控件,以显示新闻源的标题。使用“选择”工具移动并缩放文本块对象,然后使用“属性”面板的“文本”和“画笔”类别中的属性更改文本的外观。
添加文本块对象并将其绑定到标题数据项之后的美工板(实际的美工板看起来可能会有所不同)
使用数据上下文将多个控件绑定到相同数据
在向父对象分配数据上下文时,可以在所有子对象中使用数据的同一个快照。如果需要创建大纲-细节 设计,这种方法非常有用。在大纲-细节设计中,单击列表(大纲窗格)中的项,就会在另一个对象(细节窗格)中显示该项的相关细节。
创建一个“网格”布局容器
,该容器将覆盖图像和标题之下的区域。所生成的网格对象将成为在其中通过下一个步骤自动设置数据上下文的父对象。
在“对象和时间线”面板中选择新的网格对象将其激活,以便可以添加子对象。
在“数据”面板中,确保选定了“列表模式”
。在列表模式下从“数据”面板中拖动的项将创建主控件。
依次展开“rss”、“channel”和“item (Array)”节点。将“title : (String)”节点拖动到网格对象的左上角。
此时将创建一个 ListBox 控件并向其中填充“item (Array)”集合中所有新闻播报的标题。如果选择网格对象,您将在“属性”面板中看到“DataContext”属性周围显示一个黄色范围框,以显示它已绑定到数据。如果选择列表框对象,您将看到“ItemsSource”属性绑定到数据。
说明:
可将“ItemsSource”属性设置为任何项集合。每次只能使用“ItemsSource”或“Items”属性中的一个。“ItemsSource”属性通常用于绑定到生成项的集合。“Items”属性可用于通过“编辑此集合中的项”按钮手动添加各个项。
添加 ListBox 对象并将其绑定到“item (数组)”数据集合之后的美工板(实际美工板看起来可能会有所不同)
在“数据”面板中,单击“详细信息模式”
。
依次展开“rss”、“channel”和“item (Array)”节点。将“description : (String)”节点拖动到网格对象的右侧。
此时将创建网格对象,该对象内包含一个用以显示选定新闻播报描述的文本块对象。如果选择该文本块对象,您将在“属性”面板中看到“Text”属性周围显示一个黄色范围框,以显示它已绑定到数据。若要查看数据绑定的细节,请单击“Text”属性旁边的“高级属性选项”
,然后单击“数据绑定”。
添加 TextBlock 对象并将其绑定到“说明”数据项之后的美工板(实际的美工板看起来可能会有所不同)
按 F5 运行应用程序,然后单击列表框中的任何项以更改选择项,从而阅读不同的新闻说明。
说明:
有些项可能会包含 HTML 文本。可以创建一个将从“Description”字符串中删除 HTML 元素的值转换器,然后可以在“创建数据绑定”对话框中应用该值转换器。有关如何创建值转换器的信息,请参阅动手试验:将数据从一种类型转换为另一种类型。