存档: 标签: ‘Firefox’

XUL 用户界面语言介绍

没有评论 2011年11月25日

XUL[1]是英文“XML User Interface Language”的首字母缩写。它是为了支持Mozilla系列的应用程序(如Mozilla Firefox和Mozilla Thunderbird)而开发的用户界面标示语言。顾名思义,它是一种应用XML来描述用户界面的标示语言。
XUL是开放标准,重用了许多现有的标准和技术[2],包括CSS、JavaScript、DTD和RDF等。所以对于有网络编程和设计经验的人士来说,学习XUL比学习其他用户界面标示语言相对简单。
使用XUL的主要好处在于它提供了一套简易和跨平台的widget定义。这节省了编程人员在开发软件时所付出的努力。

XUL元素
XUL定义了一套丰富的元素。它们大致上可分为以下几种:
基层元素:例如视窗、page、对话框、向导
Widget:例如标签、按钮、文字方块、条列式菜单、组合方块、选择钮、复选框、树、菜单、工具栏、分组框、标签页、色彩选择器、spacer、splitter
排版:例如方框、网格、堆栈、叠
事件和脚本:例如脚本、命令、key、broadcaster、observer
数据源:例如template、rule
其他:例如overlay(类似SSI,但在客户端运作,而且更为强大)、iframe、浏览器、编辑器
一个XUL文件中也可以包含其他XML命名空间的元素,例如XHTML、SVG和MathML。
现时的XUL还未在提供一些普遍的widget,例如spinbox、slider和canvas。XUL 2.0[3]计划中将会包括这些缺乏的控件。

XUL是如何处理的[4]
Mozilla浏览器内部使用跟HTML的处理非常相似的方法来处理XUL:当你在浏览器的地址栏里面输入HTML页面的URL以后,浏览器就定位这个网址并下载页面内容,然后Mozilla将页面内容转换成树的数据结构,最后再将树转换成对象集合,集合中的对象最终被展现在屏幕上就成了我们所见的网页。CSS, 图片以及其他技术被用来控制页面的展现。XUL的处理过程与此非常类似。

XUL应用
虽然XUL的设计原意是为了创作Mozilla程序及其扩展,但事实上人们也能利用它来编写基于HTTP的网络应用程序和基于swt/swing/gwt的客户端程序。一些开源的架构使用了XUL,例如Pentaho XUL Framework[5]。Pentaho XUL使用XUl跨多种技术(Swing, SWT, GWT)渲染用户界面,来实现业务逻辑的可重用性。shandor-xul[6]项目也是基于XUl开发的,项目地址见参考资料[6]。
Firefox里内置的一些XUL 地址见:http://www.cnblogs.com/jxsoft/archive/2011/04/07/2008202.html

运行XUL应用程序
可以选择 3 种方式来运行 XUL 应用程序:
1.使用基于 Mozilla 的浏览器进行简单测试
2.使用XULRunner
3.使用Firefox 3.0作为XUL运行时,它的功能和 XULRunner很相似

总结
XUL用户界面语言是一种可用于开发Mozilla独立应用程序和浏览器扩展的通用语言,还可以用来实现跨多种UI技术的用户接口,提高业务逻辑代码的重用性,第二点视乎是更值得推荐使用的。关于XUl的教程见参考资料。

参考资料
1.XUL Wiki :http://zh.wikipedia.org/wiki/XUL
2.XML 用户界面语言(XUL)开发简介:http://www.ibm.com/developerworks/cn/education/xml/x-xulintro/section2.html
3.XUL 2.0: https://wiki.mozilla.org/XUL:Home_Page
4.XUL结构: https://developer.mozilla.org/cn/
5.Pentaho XUL ramework: http://wiki.pentaho.com/display/ServerDoc2x/The+Pentaho+XUL+Framework+Developer’s+Guide
6.shandor-xul:http://code.google.com/p/shandor-xul/
7.Mozilla XUL教程: https://developer.mozilla.org/index.php

prototype.js 源码之Prototype

没有评论 2010年9月6日

Prototype is a JavaScript Framework that aims to ease development of dynamic web applications.
Featuring a unique, easy-to-use toolkit for class-driven development and the nicest Ajax library around, Prototype is quickly becoming the codebase of choice for web application developers everywhere.
Prototype是一个致力于动态Web应用的开发的JavaScript框架。之前学校jquery源码,无意之中看到了Prototype,于是想看看Prototype是怎样实现的,顺便熟悉javascript的Prototype的概念。
继续阅读…

DOM 事件模型

2 条评论 2010年3月11日

DOM事件流

DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素结点与根结点之间的路径传播,路径所经过的结点都会收到该事件,这个传播过程可称为DOM事件流。 继续阅读…