xul文档:http://172.20.16.162//tutorials/xultu/index.html
xul标签的详细使用:/en/XUL_Reference
xul文件的创建:
<?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window id="id-window" title="title-window" orient="horizontal" ... xmlns="/keymaster/gatekeeper/there.is.only.xul"> ... </window>
按钮:
<button id="butt_1" label="Normal" disabled="false" accesskey="a"/>
文本:
<label value="This is some text" control="butt_id"/>
<description> This longer section of text is displayed. </description>
图片:
<image id="img_id" src="images/banner.jpg"/>
文本输入框:
<textbox id="some-password" type="password" maxlength="8"/> <textbox multiline="true" value="This is some text that could wrap onto multiple lines."/>
复选框:
<checkbox id="case-sensitive" checked="true" label="Case sensitive"/>
单选按钮组:
<radiogroup> <radio id="orange" label="Orange"/> <radio id="violet" selected="true" label="Violet"/> <radio id="yellow" label="Yellow"/> </radiogroup>
单列列表:
<listbox> <listitem label="Butter Pecan" value="bpecan"/> <listitem label="Chocolate Chip" value="chocchip"/> <listitem label="Raspberry Ripple" value="raspripple"/> <listitem label="Squash Swirl" value="squash"/> </listbox>
多列有标题列表:
<listbox> <listhead> <listheader label="Name"/> <listheader label="Occupation"/> </listhead> <listcols> <listcol/> <listcol/> </listcols> <listitem> <listcell label="George"/> <listcell label="House Painter"/> </listitem> <listitem> <listcell label="Mary Ellen"/> <listcell label="Candle Maker"/> </listitem> <listitem> <listcell label="Roger"/> <listcell label="Swashbuckler"/> </listitem> </listbox>
下拉列表:
<menulist label="Bus"> <menupopup> <menuitem label="Car"/> <menuitem label="Taxi"/> <menuitem label="Bus" selected="true"/> <menuitem label="Train"/> </menupopup> </menulist>
进度条:
<progressmeter id="identifier" mode="determined" value="0%"/>
定位格:
<spacer flex="1"/>
分组框:
<groupbox> <caption label="Answer"/> <description value="Banana"/> <description value="Tangerine"/> <description value="Phone Booth"/> <description value="Kiwi"/> </groupbox>
层:
<stack style="background-color: #C0C0C0"> <description value="Disabled" style="color: white; padding-left: 1px; padding-top: 1px;"/> <description value="Disabled" style="color: grey;"/> </stack> <stack> <button label="Goblins" left="5" top="5"/> <button label="Trolls" left="60" top="20"/> <button label="Vampires" left="10" top="60"/> </stack>
卡片:
<deck selectedIndex="2"> <description value="This is the first page"/> <button label="This is the second page"/> <box> <description value="This is the third page"/> <button label="This is also the third page"/> </box> </deck>
分页组:
<tabbox> <tabs> <tab label="Mail"/> <tab label="News"/> </tabs> <tabpanels> <tabpanel id="mailtab"> <checkbox label="Automatically check for mail"/> </tabpanel> <tabpanel id="newstab"> <button label="Clear News Buffer"/> </tabpanel> </tabpanels> </tabbox>
表格:
<grid flex="1"> <columns> <column flex="2"/> <column flex="1"/> </columns> <rows> <row> <button label="Rabbit"/> <button label="Elephant"/> </row> <row> <button label="Koala"/> <button label="Gorilla"/> </row> </rows> </grid>
内容面板:
<iframe id="content-body" src="" flex="1"/> <browser src="" flex="1"/>
Splitters:
<splitter collapse="before" resizeafter="farthest"> <grippy/> </splitter>
滚动条:
<scrollbar id="identifier" orient="horizontal" curpos="20" maxpos="100" increment="1" pageincrement="10"/>
工具栏:
<toolbox> <toolbar id="nav-toolbar"> <toolbarbutton label="Back"/> <toolbarbutton label="Forward"/> </toolbar> </toolbox>
菜单栏:
<toolbox flex="1"> <menubar id="sample-menubar"> <menu id="file-menu" label="File"> <menupopup id="file-popup"> <menuitem label="New"/> <menuitem label="Open"/> <menuitem label="Save"/> <menuseparator/> <menuitem label="Exit"/> </menupopup> </menu> <menu id="edit-menu" label="Edit"> <menupopup id="edit-popup"> <menuitem label="Undo"/> <menuitem label="Redo"/> </menupopup> </menu> </menubar> </toolbox> <toolbox flex="1"> <menubar id="sample-menubar"> <menu id="file-menu" label="File"> <menupopup id="file-popup"> <menu id="new-menu" label="New"> <menupopup id="new-popup"> <menuitem label="Window"/> <menuitem label="Message"/> </menupopup> </menu> <menuitem label="Open"/> <menuitem label="Save"/> <menuseparator/> <menuitem label="Exit"/> </menupopup> </menu> </menubar> </toolbox>
弹出式菜单:
<popupset> <popup id="clipmenu"> <menuitem label="Cut"/> <menuitem label="Copy"/> <menuitem label="Paste"/> </popup> </popupset>
滚动菜单:
<arrowscrollbox orient="vertical" flex="1" style="max-height:150px;"> <button label="Red"/> <button label="Blue"/> <button label="Green"/> <button label="Yellow"/> <button label="Orange"/> <button label="Silver"/> <button label="Lavender"/> <button label="Gold"/> <button label="Turquoise"/> <button label="Peach"/> <button label="Maroon"/> <button label="Black"/> </arrowscrollbox>
分隔线:
<separator class="groove-thin"/>