你的分享就是我们的动力 ---﹥

Silverlight编程模型、XAML和HTML DOM

时间:2011-10-24 09:55来源:www.chengxuyuans.com 点击:

基于 Silverlight 的应用程序使用浏览器宿主中的 Silverlight 插件通过一个基于浏览器的文档对 象模型 (DOM) 和一个包括对象树概念的特定于 Silverlight 的编程模型来公开其功能。如果使用 Silverlight 编程模型,则可以选择以下三个 API 变体之一:由浏览器解释的 JavaScript、托管代码或 由动态语言运行时 (DLR) 解释的动态语言。本主题讨论 DOM 与各可能的 API 变体之间的关系,此外, 还讨论各种 API 和应用程序模型如何使用 XAML 标记。

文档对象模型

文档对象模型 (DOM) 是一个非特定平台、且非特定语言的通用编程概念。DOM 提供文档的结构化表示 形式(例如网页)以及用于访问和操作文档的结构、样式和内容的指定方式。每个可以将 Silverlight 运行时作为插件承载的浏览器都实现一个 HTML DOM,该模型公开 HTML 页的元素,包括 Silverlight 插 件。

万维网联合会 (W3C) DOM 标准形成了在最广泛使用的浏览器中实现的 DOM 的基础。但大多数浏览器 都提供超越 W3C 标准的扩展。因此,开发人员需要认识到这些差异,才能创建非特定平台的内容。下表 中列出的浏览器 DOM 都可以访问 Silverlight。

DOM 说明
Gecko DOM(Mozilla、Firefox、Netscape 版本 6 及更高版本以及其他基于 Mozilla 的浏览 器) Gecko 是一个软件组件,用于处理 HTML 的分析、页面布局、文档对象模型以及整个应用程序 的呈现。
DHTML DOM (Internet Explorer) 动态 HTML (DHTML) DOM 为作者提供对其 Web 文档的各个组件(从各个元素到容器)的直接 可编程访问。

创建 Silverlight 插件后(一般使用 HTML object 标记),可以通过引用插件实例的 ID 在 HTML DOM 中检索对该插件实例的引用。下面的 JavaScript 示例演示如何使用 document.getElementById 方 法检索 Silverlight 插件的 ID。

var plugin_1 = document.getElementById("SLPlugin_1");

Silverlight 编程模型

Silverlight API 将它的一组对象定义为对象树,这样您就可以通过加载 XAML 来填充基于 Silverlight 的应用程序的初始内容,然后在运行时调整对象树。Silverlight 对象树是通过 Silverlight 插件(创建为网页上的插件实例)公开的。Silverlight 对 Microsoft Internet Explorer 使用 ActiveX 插件模型,对其他浏览器使用 Netscape API 插件模型。可以使用托管 API 或 JavaScript API 针对 Silverlight 进行编程,大多数情况下使用托管 API。

XAML 和 Silverlight 对象树

Silverlight 插件最初由 object 标记的 source 参数声明(如果使用托管 API,之后将由 Silverlight 应用程序模型进行处理),为该插件提供内容实际上就是在标记中定义 XAML 元素,这些元 素具有包含一个根元素的分层树结构。经过分析的 XAML 创建 Silverlight 的初始对象树。

托管 API

下面的示例创建一个标记层次结构,该层次结构包含 UserControl 根元素以及 TextBlock 和 Canvas 子对象。该示例专门用于托管 API,表示 XAP 包中的指定入口点类和基于 Silverlight 的应用程序的应 用程序清单。

XAML

<UserControl x:Class="SilverlightApplication1.Page"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
  <StackPanel>
   <Rectangle
    Width="200" Height="35"
    Fill="PowderBlue" />
   <TextBlock
    Foreground="Teal" FontFamily="Verdana" FontSize="18" FontWeight="Bold"
    Text="Sample Output" />
  </StackPanel>
</UserControl>

对于托管 API,在分析 XAML 之前,在开发人员计算机上由标记编译器先对其进行编译。有关此概念 的详细信息,请参见代码隐藏和分部类。

在客户端运行时加载和分析 XAML 时,分析器基于标记创建一个对象树。此对象树将具有一个作为根 的 UserControl 对象。事实上,它将包含特定 UserControl 子类的实例,该子类是在根元素的 x:Class 属性中引用的 Page 类。

在运行时与基于 Silverlight 的应用程序进行交互时,您使用 Silverlight 托管 API 来访问 Page 类。此外,还可以扩展到直接对象树的 Page 根以外并访问 Application 对象。Application 提供对如 下基于 Silverlight 的应用程序的各个方面的访问:即使更换了在 Silverlight 内容区域中显示的 UI 的整个隐喻性页面,也还是希望保持此应用程序。Application 包括应用程序级资源、对包含应用程序各 部分的包的访问以及连接到 HTML DOM 的对象。

松散的 XAML

对于某些托管 API 方案,可以加载松散的 XAML,这意味着要么将 XAML 文件作为内容包含在 Silverlight XAP 包中,要么可以通过 URL 访问该文件。此 XAML 不能声明 x:Class 或使用代码隐藏。 这类示例方案包括:Load 的已合并资源字典、用户特定资源或内容字符串。此松散的 XAML 与对象树其 余部分的关系取决于具体方案,在此不做说明。

JavaScript API

下面的示例创建一个包含根 Canvas 对象的标记层次结构。该示例专门用于 JavaScript API,表示单 个 XAML 文件,提供该文件的服务器与提供承载 Silverlight 的 HTML 页的服务器是同一个服务器。在 本例中,此 XAML 文件未打包且尚未由标记编译器进行编译。

XAML

<StackPanel
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
  <Rectangle
   Width="200" Height="35"
   Fill="PowderBlue" />
  <TextBlock
   Foreground="Teal" FontFamily="Verdana" FontSize="18"
   FontWeight="Bold"
   Text="Sample Output" />
</StackPanel>

此外,该 XAML 还定义一个基本 UI。事实上,它从外观上看起来与上一个示例完全相同。分析此 XAML 时,分析器基于标记创建一个对象树。该对象树将包含一个作为根元素的 StackPanel。

在运行时与基于 Silverlight 的应用程序进行交互时,不具有对整个对象树的直接访问权。您对可能 已创建的变量具有访问权限,从而可以引用 DOM 中的 Silverlight 插件,但访问编程模型通常是通过某 个事件处理程序的 sender 进行的。此 sender 是对象树中的一个对象,对于两种 Silverlight API 均 可访问。但 sender 对于 HTML DOM 通常是不可访问的;此 DOM 在主机 object 标记级别停止。

任何 Name / x:Name 引用都是由 JavaScript API 在运行时使用的,但它们最初的唯一用途是充当 FindName 调用的目标。只有在已进行 FindName 调用后,在对象树中才有实际的对象;在此之前,对象 的名称仅仅是一个字符串,而不是实际的对象。按照约定,通常使用与用于 Name 的字符串相同的变量名 称,如果在使用同一 XAML 时从 JavaScript 代码隐藏迁移到了托管代码隐藏,则此约定将会非常有用。

非浏览器宿主

Silverlight 不一定驻留在浏览器中。您还可以选择将基于 Silverlight 的应用程序部署到浏览器外 ,或编写替代宿主框架。在这些情况下,完整 DOM 和为其编写脚本功能可能不可用。

转载注明地址:http://www.chengxuyuans.com/slverlight/28288.html