Creating Applications with Mozilla-Chapter 3. XUL Elements and Features- P3 - Pdf 68

Chapter 3. XUL Elements and Features- P3

Figure 3-5. Multilevel tree hierarchy

3.4.2.4. Using trees in XUL templates
XUL templates are special built-in structures that allow dynamic updating of
XUL elements and that are often used with trees and list boxes. Templates
harness the power of the Resource Description Framework (RDF) to pull
data from external datasources and dynamically create or update content in
the UI. The following code extract shows the basic structure of a XUL
template for displaying the browser history in Mozilla:
<template>
<rule>
<treechildren>
<treeitem uri="rdf:*"
rdf:type="rdf:http://www.w3.org/1999/02/22-rdf-
syntax-
ns#type">
<treerow>
<treecell
label="rdf:http://home.netscape.com/NC-rdf#Name"/>
<treecell
label="rdf:http://home.netscape.com/NC-rdf#URL"/>
<treecell
label="rdf:http://home.netscape.com/NC-rdf#Date"/>
<!-- further cells -->
</treerow>
</treeitem>
</treechildren>
</rule>
</template>

cycleHeader(index)
Called when you click on the header of a particular column.
toggleOpenState
Put code in here to be carried out when the view is expanded and
collapsed.
setCellText (row, colID, value)
Called when the contents of the cell have been edited.
performAction (action)
An event from a set of commands can be invoked when you carry out
a certain action on the outliner. The tree invokes this method when
certain keys are pressed. For example, when the ENTER key is
pressed, performAction calls with the "enter" string.
There are more local conveniences in the form of PerformActionOnRow
and performActionOnCell.
selectionChanged
Should be hooked up to the onselect handler of the <tree>
element in the XUL content.
3.4.3. Grid
A <grid> is another XUL table structure, designed to be more flexible
with the content it can hold than the other tabular widgets. Example 3-12

shows a two-column grid that holds text input boxes and labels for them.
Example 3-12. XUL grid
<grid>
<columns><column flex="1"/><column
flex="2"/></columns>
<rows>
<row align="center">
<label value="Title"/>
<textbox id="title-text"


Nhờ tải bản gốc
Music ♫

Copyright: Tài liệu đại học © DMCA.com Protection Status