• XPCOM指南-8_编写WebLock界面
  

  编写组件的UI

  到目前为止我们建立了一个可以安装到Gecko应用中的组件。你所使用的XPCOM接口和工具是通用的跨平台的，可以被Gecko Runtime Environment或者任何Mozilla1.2以后任何基于Gecko的应用（这时GRE已经可用）。

  本章，我们将建立WebLock组件的用户接口，这就意味着添加到 现有的 Mozilla 浏览器[other-mozlike-browsers]. 他使用 XUL, 这是一个Gecko知道如何呈现用户界面的XML语言, 同时它也跟特定的Mozilla用户界面交互, 为此它要把自己作为UI的扩展安装起来。特别是，我们在本章编写的用户界面会叠加到浏览器组件的状态栏，它提供了一个小图标，用户可以通过点击它访问weblock接口。

  WebLock Indicator in Browser

  1. User Interface Package List

  本章所描述的用户界面包括4个文件:

  • webLockOverlay.xulis 这个文件定义了叠加到浏览器的图标的状态
  • weblock.xuldefines the web lock 管理器对话框.
  • weblock.cssprovides  所有XUL文本的CSS样式
  • weblock.jsprovides  所有XUL文件使用到的JavaScript函数

  下面章节描述每个文件的功能。下一章回描述你怎么使用这些文件创建一个包，一个包含了WeLock组件和UI的安装归档。

  因为这些步骤 (特别是 overlay section) 与Mozilla非常相关，这一章被分成几个不同的部分。 第二部分, XUL, 描述基于XML的用户接口语言 (XUL) 以及他如何创建一个对话框（提供访问WebLock 组件和它的服务）。 第三部分, Overlaying New User Interface Into Mozilla, 描述如何建立一个overlay到浏览器以便Mozilla build能访问这个对话框. 在overlay 部分, 我们讨论如何从Mozilla导入scripts， images, 和其他资源到你的 UI, 这会是比较复杂的部分。

  如果WebLock组件被安装到Mozilla或者其他基于Gecko的浏览器，那么第三节怎么在浏览器里创建一个控制web locking的入口点。 如果你计划部署WebLock到其他的程序，你不得不制定一个不同的访问方式（例如，原生widget实例化并控制WebLock 组件）。