1.什么是XUL
XML User Interface
Language,发音为:zool,他是为开发更快更简单的Mozilla浏览器而开发的. 这是一个基于 XML的语言
,所以XML的所有特性都适用于XUL.
XUL是为了在Mozilla上开发而发展的一种语言,而Mozilla正在日益成为象Java一样的应用程序开发平台。现在Mozilla在许多操作系
统上都有移植,因此可以基于Mozilla实现跨平台的开发。
学习XUL你需要了解的三项基本技术是:HTML,CSS和XML的基本知识。
开发和测试XUL你需要安装Mozilla/Firefox,外加文本编辑器(因为开发程序所用的文件格式都是文本的)。
我所参考的英文教程
.
2.一个最简单的XUL
先来看一个最基础的xul文件(打开一个文本文件,拷入下面代码,并另存为FindFiles.xul):
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window
id="findfile-window"
title="Find Files"
orient="horizontal"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
...
</window>
从文件头可以看出,这就是一个xml文档,并且指名了样式库
window标签,是XUL的最基本的标签,类似于HTML的Body,表示文本的开始,所有元素都必须包含在标签中,并且所有标签与属性都必须小写。
3.基本元素
为了能快速上手,我把XUL理解成一种xml+xslt的机制,xml中可以定义一些基本元素,xslt中负责解释这些元素,并呈现在页面中,而安装了
Firefox后,将提供解释xml的机制,并定义了一些基本元素,如果按照html中的基本元素来理解,就可以很快上手,随着学习的进展,可以来验证上
述的理解,下面先看看他给我们定义了哪些基本元素(括号中为该元素所拥有的属性):
- label (id,value,control)
- button (id,class,label,image,disabled,accesskey)
- image (id,src)
- textbox (id,type,maxlength,multiline,value)
- checkbox (id,checked,label)
- radio (id,selected,label)
- radiogroup (group radios together)
- listbox -- listhead -- listcol -- listitem -- listcell
- menulist -- menugroup -- menuitem
- progressmeter (id,mode,value) ,进度条
- spacer (flex) ,占位符
- html:+html元素,例如:html:table html:tr,表示使用html元素
- vbox,hbox ,类似于html中table的功能,用于页面布局,排版
这里未完全列出元素和属性,具体可以参考教程,写的很详细,下面看一个例子,来理解一下这些元素的使用:
<?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="findfile-window"
title="Find Files"
orient="horizontal"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<vbox flex="1">
<spacer style="height: 10px" flex="1"/>
<hbox>
<groupbox orient="horizontal" flex="1">
<caption label="Search Criteria"/>
<spacer style="width: 10px;"/>
<textbox id="find-text" flex="1" style="min-width: 15em;"/>
</groupbox>
</hbox>
<spacer style="height: 10px" flex="1"/>
<hbox>
<spacer flex="1"/>
<button id="find-button" label="Find"/>
<button id="cancel-button" label="Cancel"/>
</hbox>
<spacer style="height: 10px" flex="1"/>
</vbox>
</window>
另为.xul的文件后,用Firefox打开,可以看到如下效果:
4.脚本控制
XUL中的脚本是通过script元素包含进来的,一个XUL文件中可以包含多个script元素,其使用方法与DHtml中没啥两样,同样将Script使用到事件句柄后就可以了
<script src="findfile.js"/>
<script src="chrome://findfiles/content/help.js"/>
<script src="http://www.example.com/js/items.js"/>
<script>
function buttonPressed(event)
{
alert('Button was pressed!');
}
var button = document.getElementById("okbutton");
button.addEventListener('command', buttonPressed, true);
</script>
<button id="test" onclick="alert('haha')"></button>
学习到这里,感觉XUL相对于Html来说,提供了更为丰富的页面元素,使用类似于Html,但是更为强大。目前还不知道能否在IE中使用,也不清楚怎么应用到桌面程序中,希望通过继续的学习来得到答案。
分享到:
相关推荐
博文链接:https://zsp.iteye.com/blog/232047
是一个xul music player
XUL 是经过测试的真正...在本教程,您开始使用 XUL 进行编程,并学习一些帮助您开发 XUL 应用程序的工具。当您的 Web 开发技术得到提高时,您可以构建一个基于 XUL 的博客编辑器,并通过它使用 XUL 构建桌面应用程序。
XUL开发手册.pdf
xul文档具体标签说明和例子xul文档具体标签说明和例子
《初识XUL用户界面UI开发》XUL是Mozilia社区开发技术中的一员,总要是为用户界面UI服务,Firefox就XUL以及其它一系列相关的基础库开发出来的成功之作。事实证明XUL是成功的UI开发技术,本文以一个最简明的视角来向看...
一个用xul写的便签,可以实现记事的功能
xul是XML User Interface language 的简写,是Mozilla基金会开发的一种基于XML的标记语言,一般用来构造程序的界面,典型的firefox就是这种的实践,目前XUL只能被Firefox的浏览器支持,它和js,css,html等理论上能够...
该xul是我学习心得与体会
清晰给出繁杂配置和步骤, c++开发xpcom组件的完整例子, vs2005 环境配置 ,xpconnect调用xpcom组件, xul 中使用javascript 内有源码,配置图示
一个很完善的tree,使用xul界面语言完成。 一个很完善的tree,使用xul界面语言完成。 欢迎大家使用,提出意见。
NULL 博文链接:https://monlyu.iteye.com/blog/348583
XUL (XML User-interface Language - 基于 XML 的用户接口语言)是一种新的富客户端(Rich Client)技术,是 Mozilla 和 Firefox 的核心语言,是一种用来快速开发跨平台用户接口的新途径。其实不难发现很多新出现的...
XUL Mozilla XPCOM Gecko 学习资料
XUL标签的介绍及用法,最近学ZK淘换来的,挺全的
XUL Mozilla XPCOM Gecko 学习资料 共两个文件,全部解压到同一目录
开发firefox扩展时使用XUL文件的自动补齐acp文件,用于editplus。不知能否用于其他编辑器 对XUL reference中列出的标签都可进行自动补齐, 如box标签,使用自动补齐之后只需要输入box然后按空格键即可自动补齐为 ...
ffjcext.xul
自己写的一个xul的小程序。本程序包含了xul程序的基本框架,是初学者入门的不错的选择。下载后,直接在firefox上安装,会在状态栏出现helloworld标签。 也是自己编辑本示例,将文件后缀改为zip,解压就可以看到示例...
xul 是xml user Interface language的简称,xul 是xml 语言的一种应用,用来开发图形界面的语言,它是有Mozilla发明的技术,主要用在开发firefox的插件上,firefox浏览器就是基于html,xul,css,js等构建的软件。...