xul帮助手册.docx

1、xul帮助手册一、XUL的元素及属性描述：1、 一个 XUL 文件可以有任何名字，但它必须拥有一个 .xul 的扩展名。2、 简单声明一个XUL文件，通常在每个XUL文件都会添加这一行。3、 这一行是用来指定使用的样式表的。这是XML用于导入样式表的语法。4、 这个标签用来描述一个窗体，每个用户界面的窗体都在一个单独的文件中描述，类似HTML中的标记5、 标签的几个属性：(1) id 属性用作标识以便被窗体脚本引用。(2) title 属性描述显示时将在窗体的标题栏上显示文本。(3) orient 的属性确定窗口中元件的排布。其值有：horizontal窗体应该横过窗体水平放置；Vertica

2、l 表示元件将成一列放置(4) xmlns=http:/www.mozilla.org/keymaster/gateKeeper/there.is.only.xul 这一行声明了XUL的名空间，将它放在窗口元件表示它的所有子元件都是XUL，Mozilla内部会识别这个 URL;(5) 表示注释6、 打开窗口 window.open(url,windowname,flags) 其中url 表示文件路径，windowname 表示窗体的名字，flags 是指chrome 文档7、 的属性：（1） id 用来表识按钮的唯一标识。（2） class 按钮的样式表（3） label 标签会显示在按钮上（

3、4） image 在按钮上显示指定路径的图片（5） disabled 如果这个属性被设置为true,按钮就会被禁止，如果这个属性没有表示这个按钮会被启动（6） accesskey 设置快捷键，通常是字母8、 标签元素属性：（1） value 属性被用于制定要显示的文本（2） Control 属性去设置关联的标签，设置control属性的值会触发与这个值对应的id的元素9、 标签元属描述 在没有一些特定的关联操作的文本时你可以使用 description 标签，这个元素使用于在对话框的上面或实例的一组控制的文本提示信息. 既可以在 value 属性中指定单行的文本也可以在开合标签之间填充一大块的

4、文本10、 文本输入框的属性：（1） id 属性：控件的唯一标识（2） class属性：输入框的样式表（3） value属性：指定输入框的文本（4） disabled属性：文本输入框是否禁用（5） type 属性：可以将这个属性设置为password,创建一个输入框隐藏用户输入内容，通常为密码框（6） maxlength 属性： 输入框允许输入的字符最大数量；（7） multiline 属性： 其值若为true 表示文本框将显示多行。若为 false 文本不显示多行11、 单选按钮的属性： (1) id 属性：控件的唯一标识(2) label 属性： 单选按钮的文本(3) disabled 属

5、性：其值可以是true或false,若为true表示按钮被禁用，反之为启 用(4) accesskey 属性：用于选中元素的快捷键12、 单选按钮组属性： 若在一个组中只能选择一个13、 多选框属性：（1） id 属性：控件的唯一标识（2） checked属性：表示受否被选中，其值有true或false （3） label 属性：指定标签的文本（4） selected 属性：和checked属性类似，其值有true或false14、 列表控件属性： 描述：listbox元素用于创建多行的列表框，它的工作方法类似于在HTML中 的select元素，和连用创建下拉列表，相似于HTML 中的。（1）

6、 id属性： 控件的唯一标识（2） rows属性：指定一次显示几行例子如下： 15、 多列列表框： 描述：列表框也支持多列。每个单元格可以有独有的内容，即使只使用文本。当用户选择列表中的一个项目时，当前的行将被选中。你不能只选中其中的一个单元格。 例子如下： 上面例子中的元素用来定义列字段集，元素用来定义每列的外观，元素用来定义一行，类似HTML中的标签;用来定义每个单元，类似HTML中的标签；使用和来定义表头16、 下拉列表： 描述：XUL中的下拉列表类似HTML中使用select元素创建的下拉列表。XUL中的menulist元素可以实现这种效果。 的属性： accesskey 属性：设置快

7、捷键； disabled 属性：设置控键是否被禁用; open 属性：其值为true或false,如果为true,菜单列表显示，否则隐藏； label属性：设置文本； aditable属性：其值为true或false ， 如果为true表示此菜单列表可以编辑，如为false则不能编辑。 例子如下： 17、 进度条属性： Id 属性： 进度条的唯一标识符。 Mode属性： 进度条的类型。如果设置为determined,进度条就是确定型进行度，在任务完成时填满。如果设置为undetermined，这个进度条就是不确定型进度条。如果不指定这个属性默认为确定型。 Value 属性： 当前进度条的尺度值

8、。只能在确定型的进度条中使用这个属性。这个值的范围为0%到100%的百分值。 例子演示： 18、 增加HTML元素到窗口 （1） XHTML命名空间： 描述：为了在XUL文件中使用HTML元素，必须声明要用到的XHTML命令空间。这个方法是Mozilla从XUL中区分HTML标签的。 例子演示： 注意事项：1、 必须在每个标签的开始增加一个html:的前缀；2、 标签必须用小写3、 “双引号”必须完成所有属性值括起来。4、 在没有内容的xml标签的末端()前一定要加上结束(/)；（3） 使用HTML元素：例子演示： A simple table 19、 使用定位格：元素 描述：spacer用于

9、在窗口中放置一片空白，它多用于用户调整窗口大小 时它可以拉伸或者收缩。 元素的属性： 用于指定元素可以改变自身的尺寸去填充它所在的盒子(窗口)，它说明在一个盒容器的子容器中填入多少的空白空间。 例子演示： 20、 按钮:属性： Image 属性：可以通过指定URL为按钮添加图像； Style 属性： 在按钮上指定图像的另一个方法是使用样式表(CSS list-style-image:url(图片的路径)； dir 属性: 属性控制图像和文本方向。设置这个属性的值为reverse,图像将会放在文本的右边。使用normal值，或删除这个属性，图像将会放在文本左边。 Orient 属性： 属性用于在

10、将图片放在文本的上面或下面。默认值时horizontal用于将图像放在文本的左或右。也可以使用值vertical将图像放在上方或下方。如果用在normal的意思时将图像放在文本的上方，而用在reverse的意思时将图像放在文本的下方。 crop 属性： 它可以用来裁剪元素的内容。当元素的宽度超过maxwidth时，超出的部分会去掉，变成.。不过这个属性只可以用在description和有label的元素中。其值有left,righr,none,center; left:指超出的文本部分从文本的左部分裁剪。 Right:指超的出文本部分从文本的右边裁剪。 Center:指超出的文本部分不文本的中

11、间裁剪。 None:指超出的不分文本不被裁减，默认值为none; 特殊按钮例子： 弹出菜单按钮： ” 21、 箱体的基本语法： !horizontal element !Vertical element 注释： hbox元素：用来创建一个水平方向的盒子。每个放在hbox的元素将被水平地排成一行。 Hbox属性： align属性：控制内部元素的垂直位置，其值有start,center,end,baseline,stretch; start 是指box里面的元素靠顶端对齐。 center 是指 box 里面的元素靠中间对其。 end 是指 box 里面的元素底端对齐。 baseline 是指 bo

12、x 里面的元素按照文本底线对齐。 sretch 自动扩展 vbox元素：用来创建一个垂直方向的盒子。每个放在vbox的元素将被垂直地排成一列 例子演示：1、 登陆提示范例 2、 文本框对齐 3、 文件查找对话框示范 Enter your search criteria below and the Find button to begin the search. 22、 元素属性： Width 属性： 指定元素的宽度。 Height 属性： 指定元素的高度。 Minwidth 属性：指定元素的最小宽度。 Minheight 属性：指定元素的最小高度。 Maxheight 属性：指定元素的最大宽度

13、。 元素：通过修改orient为horizental，表示元素水平摆放。为vertical 表示元素垂直摆放。 Pack属性： Start 对于水平box，他就是左对齐。对于竖直的box，他就是顶端对齐。 Center 居中； End 如说是水平box，他就是右对齐。对于竖直的box，他就是底端对齐。 align 属性：start如果是水平的box，它就是顶端对齐。如果是竖直的box，它就是左对齐。 center居中 end如果是水平的box，它就是底端对齐。如果是竖直的box，它就是右对齐。 baseline文本线对齐，只可以用在水平box上。 stretch自动扩展23、 分组框：（1）

14、gropbox的描述：gropbox是一个box容器，里面的元素会按照box布局规则来显示。与其他box相比，gropbox有以下特点：1、 默认有边框。你可以通过修改其cess来改变边框。2、 可以添加标题(caption).标题会显示在gropbox的左上方。（2） gropbox的属性： align:start 如果是水平的box，它就是顶端对齐。如果是竖直的box，它就是左对齐。 Center 居中； Baseline 文本线对齐，只可以用在水平box上。 End 如果是水平box，他就是底端对齐。如果是竖直的box，他就是右对齐。 Stretch 制动扩展。 Pack属性： Star

15、t 对于水平box，他就是左对齐。对于竖直的box，他就是顶端对齐。 Center 居中； End 如说是水平box，他就是右对齐。对于竖直的box，他就是底端对齐。 例子演示： 或 （3） radiogroup的描述：radiogroup首先是一个box容器，里面可以放xul元素，但radiogroup对单选框(radio)有特殊意义。可以通过selectedItem 来访问选中的radio。例子演示： 24、 层和卡片： Statck 元素：statck 是按照绝对位置定位布局方式的容器。因此，align、pack、dir、orient等属性对于stack来说是无效的。Stack内部元素的

16、位置取决于元素的left、top属性。这种布局模式类似于VB或Delphi的布局模式。需要注意的是：内部元素的left、top是指相对于stock的位置，而不是相对于window或者screen的位置。所谓的绝对定位，是指其直接孩子元素。非直接孩子元素不执行stack的布局逻辑。 例子演示： Deck 元素： Deck 内的元素也是层叠在一起的，但与stack不同的是，deck 一次只显示其中的一个孩子元素。当前显示哪个孩子，是由selectedIndex属性控制的。Deck 常用于向导对话框。我们可以通过设置内部元素的left、top属性来控制其显示位置 例子演示： 或 button label=Trolls left=60