XUL2.0帮助手册.doc

上传人:hw****26 文档编号:3553479 上传时间:2019-06-04 格式:DOC 页数:22 大小:209.50KB
下载 相关 举报
XUL2.0帮助手册.doc_第1页
第1页 / 共22页
XUL2.0帮助手册.doc_第2页
第2页 / 共22页
XUL2.0帮助手册.doc_第3页
第3页 / 共22页
XUL2.0帮助手册.doc_第4页
第4页 / 共22页
XUL2.0帮助手册.doc_第5页
第5页 / 共22页
点击查看更多>>
资源描述

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

2、过窗体水平放置;Vertical 表示元件将成一列放置(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、式表(3) label 标签会显示在按钮上(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) la

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

6、 HTML 中 的 select 元素,和连用创建下拉列表,相似于 HTML中的 。(1) id 属性: 控件的唯一标识(2) rows 属性:指定一次显示几行例子如下:15、多列列表框:描述:列表框也支持多列。每个单元格可以有独有的内容,即使只使用文本。当用户选择列表中的一个项目时,当前的行将被选中。你不能只选中其中的一个单元格。 例子如下:上面例子中的元素用来定义列字段集, 元素用来定义每列的外观,元素用来定义一行,类似 HTML 中的 标签;用来定义每个单元,类似 HTML 中的标签;使用 和来定义表头16、 下拉列表:描述:XUL 中的下拉列表类似 HTML 中使用 select 元素

7、创建的下拉列表。XUL 中的menulist 元素可以实现这种效果。的属性:accesskey 属性:设置快捷键;disabled 属性:设置控键是否被禁用;open 属性:其值为 true 或 false,如果为 true,菜单列表显示,否则隐藏;label 属性:设置文本;aditable 属性:其值为 true 或 false , 如果为 true 表示此菜单列表可以编辑,如为 false 则不能编辑。例子如下:17、进度条属性:Id 属性: 进度条的唯一标识符。Mode 属性: 进度条的类型。如果设置为 determined,进度条就是确定型进行度,在任务完成时填满。如果设置为 und

8、etermined,这个进度条就是不确定型进度条。如果不指定这个属性默认为确定型。Value 属性: 当前进度条的尺度值。只能在确定型的进度条中使用这个属性。这个值的范围为 0%到 100%的百分值。例子演示:18、增加 HTML 元素到窗口(1) XHTML 命名空间:描述:为了在 XUL 文件中使用 HTML 元素,必须声明要用到的 XHTML 命令空间。这个方法是 Mozilla 从 XUL 中区分 HTML 标签的。例子演示:注意事项:1、 必须在每个标签的开始增加一个 html:的前缀;2、 标签必须用小写3、 “双引号”必须完成所有属性值括起来。4、 在没有内容的 xml 标签的末

9、端()前一定要加上结束(/);(3) 使用 HTML 元素:例子演示:A simple table19、使用定位格: 元素描述:spacer 用于在窗口中放置一片空白,它多用于用户调整窗口大小时它可以拉伸或者收缩。元素的属性:用于指定元素可以改变自身的尺寸去填充它所在的盒子(窗口),它说明在一个盒容器的子容器中填入多少的空白空间。例子演示:20、 按钮:属性:Image 属性:可以通过指定 URL 为按钮添加图像;Style 属性: 在按钮上指定图像的另一个方法是使用样式表(CSS list-style-image:url(图片的路径);dir 属性: 属性控制图像和文本方向。设置这个属性的值

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

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

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

13、的最小高度。Maxheight 属性:指定元素的最大宽度。元素:通过修改 orient 为“horizental“ ,表示元素水平摆放。为“vertical“ 表示元素垂直摆放。Pack 属性:Start 对于水平 box,他就是左对齐。对于竖直的 box,他就是顶端对齐。Center 居中;End 如说是水平 box,他就是右对齐。对于竖直的 box,他就是底端对齐。 align 属性:start 如果是水平的 box,它就是顶端对齐。如果是竖直的 box,它就是左对齐。 center 居中 end 如果是水平的 box,它就是底端对齐。如果是竖直的 box,它就是右对齐。baseline

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

15、平 box,他就是底端对齐。如果是竖直的 box,他就是右对齐。Stretch 制动扩展。Pack 属性:Start 对于水平 box,他就是左对齐。对于竖直的 box,他就是顶端对齐。Center 居中;End 如说是水平 box,他就是右对齐。对于竖直的 box,他就是底端对齐。例子演示:或(3) radiogroup 的描述:radiogroup 首先是一个 box 容器,里面可以放 xul 元素,但radiogroup 对单选框(radio)有特殊意义。可以通过 selectedItem 来访问选中的radio。例子演示:24、层和卡片:Statck 元素:statck 是按照绝对位置

16、定位布局方式的容器。因此,align、pack、dir、orient 等属性对于 stack 来说是无效的。 Stack 内部元素的位置取决于元素的 left、top 属性。这种布局模式类似于 VB 或 Delphi 的布局模式。需要注意的是:内部元素的 left、top 是指相对于 stock 的位置,而不是相对于 window 或者 screen 的位置。所谓的绝对定位,是指其直接孩子元素。非直接孩子元素不执行 stack 的布局逻辑。例子演示:Deck 元素:Deck 内的元素也是层叠在一起的,但与 stack 不同的是,deck 一次只显示其中的一个孩子元素。当前显示哪个孩子,是由 s

17、electedIndex 属性控制的。Deck 常用于向导对话框。我们可以通过设置内部元素的 left、top 属性来控制其显示位置例子演示:或25、分页组:描述及语法:tabbox 用于界面元素的分页显示。常用于显示用户选项等界面元素多,界面大小有限的用户界面。用户可以通过选择不同的 tab 页来查看不同的内容。xul 中提供了 5 个元素来实现分页组tabbox:最外层的容器,一般内部包含一个 tabs 和 tabpanels。tabs:tab 的容器。当然你也可以在里面加入其他的 xul 元素来丰富导航 tab 的界面。tab:具体的每一个分页卡,用户通过选择不同的 tab 来切换显示页

18、。tabpanels:tabpanel 的容器。tabpanel:里面放置具体的页面内容。tab 与 tabpanel 的对应关系是按照他们在各自容器中的序号来确定的。 tabs 中的第一个 tab 对应 tabpanels 中的第一个 tabpanel。基本语法如下:- tab elements go here - tabpanel elements go here -由于 tabbox 本身是一个容器,因此,tabs 的显示位置取决于它在 tabbox 中的顺序以及 tabbox 的 orient、dir 属性。tabbox 的大小取决于它内部最大 tabpanel 的大小,因此,在切换

19、tab 页的时候,tabbox 的大小不会随着 tab 页切换而改变。例子演示:当前 tab 页的 tab 元素的 selected 属性是 true。如果我们将 tabbox 的 orient 设置为水平模式,tabs 会出现在左面。26、表格:描述:其组件包括 grid,columns,column,rows 和 row。Grid 包含排列整齐的组件就像表格一样。在 grid 内,可以声明 columns,定义 header 及 column 属性;还可以声明 rows。使用 rows 组件可以声明一套 row,即为 grid 元素的子组件。每个子元素为指定列的一行。例子演示:滚动网格:当指定 height 属性且没有足够的空间来显示数据时,grid 会变为滚动的。可改变列的网格:如果想改变列的宽度,可以将 columns 的sizable 属性的设为 true。一旦允许用户进行此操作,用户可以拖动相邻列的编筐来改变列宽。分页网格:1、滚动分页:滚动可以由指定 height 属性来实现。分页可以由 mold 属性设为 paging 来实现。

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 教育教学资料库 > 精品笔记

Copyright © 2018-2021 Wenke99.com All rights reserved

工信部备案号浙ICP备20026746号-2  

公安局备案号:浙公网安备33038302330469号

本站为C2C交文档易平台,即用户上传的文档直接卖给下载用户,本站只是网络服务中间平台,所有原创文档下载所得归上传人所有,若您发现上传作品侵犯了您的权利,请立刻联系网站客服并提供证据,平台将在3个工作日内予以改正。