《XUL指南》第九章:RDF和模版

目录 XML

翻译时间:06年4月13日,未翻译完,不过可能不会再译了

本文件为Word格式,有兴趣接着翻译的请跟我联系

九、RDF和模版

9.2 模板

该节我们将认识如何使用数据扩展内容

扩展内容

XUL提供使用RDF格式的数据创建内容的方法,可以是RDF文件也可以是内部数据源。Mozilla提供众 多数据源,例如书签、历史和邮件信息,在下节有详细介绍。
通常使用数据来对树状分类和菜单进行扩展,而你也可以选择其它元素只要有需要。不过这里我们会使用其它元素进行讲解,因为树和菜单的代码多得多。
要允许创建基于RDF数据的元素,你需要提供一个用于复制元素的简单模板,也就是说你只要提供第一个元素,剩下的元素将从第一个构造生产。
模板由template元素组成,把template元素放置你想构造的元素里面。例如你想在tree容器使用模板,你必须把template放在tree里面。
用一个例子比较好说明,这里我们做一个为每个顶层书签加个按钮的例子。Mozilla提供书签数据源,所以我们可以从那获取数据。这个例子只读取书签文件夹和顶层书签来创建按钮,为了分清子级书签,我们需要使用tree或menu元素来显示。

[……]

Read more

《XUL指南》第四章:更多布局元素

目录 XML

翻译时间:06年4月10日,本章未翻译完,不过可能不会再译了

四、更多布局元素

4.1 Stacks 和 Decks

有时需要将内容重叠起来,就像重叠的卡片,stack和deck元素可以实现这效果。

容器

每个XUL里面BOX都是一个可以包含任何内容的容器 ,容器里面有许多不同类型的元素,例如工具栏、标签面板(Tabbed Panels)。BOX标签只是创建一个简单的容器,而里面其它元素将按默认规则工作,但它们有另外特征。

事实上,很多控件可以包含其它元素,例如我们之前看过的按钮。在容器里面滚动条(Scroll Bar)是一个特殊元素, 在接下来几节里,我们将介绍一些服务于其它元素的元素,它们都是特殊元素以及拥有容器的所有属性。
……
[……]

Read more

《XUL指南》第一章:引言

目录 XML

这是以前在维豪上班时翻译的文档,可惜没有翻译完就离开了

XUL指南

原作者:Neil Deakin
原文出处:http://www.xulplanet.com/tutorials/
原文最后更新日期:2006年2月19日(当地时间)
翻译:梦游的猫
译文最后更新日期:2006年4月10日(北京时间)

欢迎查看XUL指南,该指南讲述XUL——XML的一种用户界面语言,该语言基于Mozilla框架,用于定义其用户界面。
该指南讲述的XUL基于Mozilla1.7和Firefox1.0

一、引言

1.1 引言

这份教程可以帮助你如何用 XUL (XML用户界面语言) 来创建跨平台的可描述界面的应用程序.

这份教程将设计出一个”查找文件”的应用程序界面, 类似于Macintosh的Sherlock或是Windows的文件查找的窗口. 只会提供基本的界面以及一些简单的功能函数. 真正的文件查找功能并没有实现,.

什么是XUL,及为什么要创建它?

XUL (发音是 zool,有点像cool) 是为开发更快更简单的Mozilla浏览器而开发的. 这是一个基于 XML的语言 ,所以XML的所有特性都适用于XUL.

大多数应用程序在开发的时候都需要应用某个特定平台的特性,这就使得创建一个跨平台的软件变得费时费力。而这对于某些用户或许并非重要,但是对那些想在其它设备上,比如手持设备或机顶盒上,运行一个应用程序的用户来说却,跨平台确是至关重要的。

在过去诸多跨平台的解决方案都已被开发出来。比如Java的可移植性就是其主要卖点。XUL则是一个那样的语言,它被设计出用于创建可移植的用户界面。

创建一个应用程序是要花费好多时间的,哪怕它只工作在某个平台下。编译和排错需要的时间可能会很多。而使用XUL,一个界面可以被快速方便地制作和修改。

XUL具备所有其它XML语言的所有优点。举例来说,XHTML或者其它XML语言,比如MathML 或 SVG,可以被插入到XUL当中。同样,XUL中的文本也可以很容易地被本地化,那意味着它可以稍加努力就可以被翻译成其它国家的语言。样式表可以被提供用于修改用户界面的外观(就像WinAmp的主题和皮肤或者某些窗口管理器)。

[……]

Read more

XUL+CSS做弹出菜单

目录 XML

很多软件都用这种效果,右边是效果图,使用的时候很简单,给<popup>标签加上css定义就可以了,如红色部分所示

菜单我挑了一个代码少的,效果一样哈

<popup id=”emailAddressPopup” popupanchor=”bottomleft” onpopupshowing=”goUpdateCommand(‘cmd_createFilterFromPopup’);” class=”popMunu”>
    <menuitem label=”&SendMailTo.label;” accesskey=”&SendMailTo.accesskey;” oncommand=”SendMailToNode(document.popupNode)”/>
    <menuitem label=”&CreateFilterFrom.label;” accesskey=”&CreateFilterFrom.accesskey;” command=”cmd_createFilterFromPopup”/>
    <menuitem label=”&AddToAddressBook.label;” accesskey=”&AddToAddressBook.accesskey;” oncommand=”AddNodeToAddressBook(document.popupNode)”/>
    <menuitem label=”&CopyEmailAddress.label;” accesskey=”&CopyEmailAddress.accesskey;” oncommand=”CopyEmailAddress(document.popupNode)”/>
</popup>

 下面是CSS文件部分,其中popmune_left.png是蓝色的渐变图

.popMunu{
    border: 1px solid #A0A0A0;
    background-color: #FAFAFA;
    padding: 0 2px 0 26px;;
    margin: 0;
    color: Black;
    line-height: 1.5em;
    background-image: url(images/popmune_left.png);
    background-repeat: repeat-y;
}
.popMunu menuitem{
    margin:1px 0;
    padding: 2px 0;
}
.popMunu menuitem:hover{
    background-color: #D5DFF1;
    color: Black;
}

[……]

Read more

XUL学习笔记(4)

目录 XML

笔记就先写到这,今天起开始翻译XUL Planet的《XUL指南》,哈

四、XUL常用元素

4.1 创建窗体

当准备好开发工具之后,就可以开始写XUL了。先看一段XUL文件

<?xml version=”1.0″ encoding=”GB2312″?>
<?xml-stylesheet href=””chrome://chrome/skin” type=”text/css”?>
<?xml-stylesheet href=””chrome://chrome/skin/contact.css” type=”text/css”?>
<window
id=”QQ_setup”
class=”sb_faceplate”
title=”QQ2006设置”
xmlns:html=”http://www.w3.org/1999/xhtml”
xmlns=”http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”
>

解释一下

  1. <?xml version=”1.0″ encoding=”GB2312″?>
    XUL也是XML文件,每个XML都必须有一个声明,这里声明了版本和编码
  2. <?xml-stylesheet href=””chrome://chrome/skin” type=”text/css”?>
    <?xml-stylesheet href=””chrome://chrome/skin/contact.css” type=”text/css”?>
    指明样式表所在位置,chrome是Mozilla一种协议,就像http一样,只有当包被注册到Mozilla后才可以通过chrome访问资源,所以在测试XUL时,可以用相对或绝对路径,比如
    <?xml-stylesheet href=”../skin/contact.css” type=”text/css”?>
    作用是一样的
  3. <window
    每个文件只能有一个window标签,相当于html的body
    id=”QQ_setup”
    用于唯一识别元素,可以为JS所调用

    class=”sb_faceplate”
    引用的样式表类名

    title=”QQ2006设置”
    窗体标题

    xmlns:html=http://www.w3.org/1999/xhtml
    xmlns=http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul
    引入XUL所用的名字空间。照抄就行。
    >
    除了上面,还有其它属性,常用的有
    hidechrome=”true” 窗口标题栏是否隐藏
    height=”200″ 窗口高度
    sizemode=”maximized | minimized| normal” 窗口初始化模式,最大化、最小化和普通
    ……
    [……]

Read more

XUL学习笔记(3)

目录 XML

该节讲的是扩展开发的,代码很多,这里跳过,简单说一下就好了,哈

三、目录和文件结构

3.1 目录结构

一个标准的扩展程序,解压后有几个目录

  • Chrome:必备目录,底下有一个JAR文件,保存着扩展外观和逻辑功能代码。解压缩此 JAR 文件之后,一般会生成以下 3 个目录。
  • content:用于存储负责描述扩展界面的 XUL 文件和完成实际逻辑功能的 JS 文件;
  • locale:录下还会有针对不同语言的子目录,这些子目录会被起成如“en-US”,“zh-CN”这种用来区分“语言-国家/地区” 的名称。通过这种国际上标准的语言区分方式,Mozilla 会根据其自身的语言,选择一个最合适的语言目录让 content 中的文件进行引用;
  • skin:用于存储负责美化界面外观的样式表文件和图片文件,这些文件中的样式和图片会被 content 目录中的文件所引用,如“classic”,“modern”等。不过,一般情况下,我们只创建针对 classic 的“皮肤”。如果扩展没有使用单独的样式表文件和图片,那么它也是可以被省略的;
  • Components:存放自定义XPCOM组件,在没自定义XPCOM组件情况下,改目录不存在
  • defaults:存放默认数据,其下还有子目录

另外,有3个必备的特殊文件

  • install.rdf:它是一个 RDF/XML 格式的文件,用于描述当前扩展的注册信息和附加信息等。扩展在安装时,负责安装扩展的程序会自动分析此文件的信息,然后将这些信息注册到 Mozilla 系统下。此文件必须被命名为 install.rdf,并置于扩展压缩包的顶级目录下;
  • install.js:负责安装扩展的脚本,此文件可选。一般情况下,install.rdf 完全可以胜任扩展的安装注册工作。但是,如果有些扩展要在安装时做一些额外的准备工作,则要通过一个称为 XPInstall 的机制来完成,那些负责额外工作的代码则要被固定地写到此文件中;
  • chrome.manifest:负责将扩展的各种包注册到 Mozilla 的 chrome 系统中。Gecko 1.8 内核新引入的机制,用来代替原有的 contents.rdf 文件;

[……]

Read more

XUL学习笔记(2)

目录 XML

1.3 XUL可以做什么

先补充一下,XUL发音为:zool
XUL可以创建图形界面的绝大多数元素,像Firefox、Thunderbird界面都是XUL的应用。

  1. 输入控制,如文本框和检查框
  2. 带按钮或其它内容的工具条
  3. 菜单条上的菜单或弹出菜单
  4. 分页的对话框
  5. 分级树型结构或表格信息
  6. 快捷键

1.4 XUL相关资料

目前XUL应用并不多,相关资料(无论中文或英文)非常的少,大多仅有一些简单的介绍而已,下面是几个相关网站
http://www.xulplanet.com
http://developer.mozilla.com

二、开发平台

2.1 开发工具

  1. Firefox
    下面的链接地址可以让你快速地定位新版本的下载位置。
    http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/
    安装时,你需要选择“自定义(Custom)”安装模式。因为在这种模式下,我们可以选择并安装“开发工具(Developer Tools)”,这一点对于开发人员尤其重要。
  2. UltraEdit-32,基本上现在没有专门用于XUL的开发工具,所以需要一个好的文本编辑器。
    ……
    [……]

Read more

XUL学习笔记(1)

目录 XML

一、XUL简介

XUL是“XML 化的用户界面语言(XML User Interface Language)”的缩写,跟XML一样是一种与平台无关性的语言,是用来描述用户界面的语言,现在被广泛用于Mozilla平台。Mozilla本身的界面就是用XUL进行描述的。

1.1 XUL相关技术

XUL与以下技术相关:

    1. CSS:层叠样式表(Cascading Style Sheets)的缩写,这是一种可以通过规则来控制 HTML/XUL/XML 等显示外观的语言。(其实XUL本身就是XML其中一种)
    2. DOM:文档对象模型(Document Object Model)的缩写,这是一个允许通过脚本来动态访问和更新 HTML/XML 文档的内容,结构和样式的接口。
    3. JavaScript:由 Netsacpe 公司的 Brendan Eich 创造的一种解释型语言,它主要用来进行基于浏览器下的脚本应用开发。因为 Mozilla 内置了 JavaScript 解释器,所以使用 JavaScript 开发扩展,就成为编程语言的首选。虽然,你也可以使用 C++,Perl,Python 等进行扩展的开发,但这些语言的先天优势都明显不足。
    4. XHTML:可扩展超文本标记语言(The Extensible HyperText Markup Language),XUL同XHTML语法有很多类似之处,而且XUL允许在内部嵌入HTML代码。
    5. XPCOM:跨平台组件对象模型(Cross -platform Component Object Model)的缩写,它很像微软的提出的组件模型技术,但它是跨平台的,即其运行环境可以不依赖于某种特定的操作系统平台。
    6. XPConnect:一种将 XPCOM 与 JavaScript 连接起来的技术。该技术允许组件被脚本化,而且能够用 JavaScript 来进行组件的开发。
    7. XBL:可扩展的绑定语言 (Extensible Binding Language)的缩写。
    8. RDF:资源定义框架(Resource Definition Framework)的缩写。Mozilla 使用这种文件格式来保存扩展的注册信息和描述信息等。

    对于扩展开发来说,必须掌握的技术有 XUL,CSS,DOM,XPCOM,JavaScipt,而对于 XBL,XPConnet,RDF 做简单了解即可。

    2.2 各相关技术的功能

    如果说CSS是控制网页界面的话,那XUL即是控制桌面应用程序界面的语言。

    1. CSS用来控制程序界面,利用CSS可以在界面加上一些效果,例如字体大小、边框、颜色等。当然,也有一些Mozilla独有的特性。
    2. DOM 主要用来为 JavaScritp 提供一个 HTML/XML 的文档操作接口,并且,它也可以用来操作 CSS,对界面进行“动态”操作,如:按钮的禁止与否,动态装载数据等。可以看出,通过 DOM 接口,我们可以将程序的逻辑处理部分与界面表现部分有机的结合起来。
    3. JavaScipt 是扩展开发的核心要求,它主要用来实现程序的业务逻辑描述。可以说,从网页下的 JavaScript 开发到扩展下的 JavaScript 开发,是一种由轻量级到重量级的转变。

    由于 JavaScript 语言只内置了几个与本地访问无关的对象,而对于桌面开发来说,显然不能满足要求。因为桌面开发需要访问大量的本地和网络资源,包括文件,剪贴板,Socket,浏览器本身等各种资源。而 XPCOM 为面向桌面的开发提供了这种可能。只有使用 XPCOM,我们的扩展才可以做出实用的功能,没有 XPCOM,本地与远程的资源整合可以说是不可能。
    [……]

    Read more