Adding grid examples. Not in build.

This commit is contained in:
evaughan%netscape.com 2001-12-07 00:56:24 +00:00
Родитель 704f5f5fc1
Коммит 25c9c2166b
17 изменённых файлов: 1158 добавлений и 0 удалений

Просмотреть файл

@ -0,0 +1,40 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" id="grid">
<columns>
<column style="border: 10px inset red;"/>
<column/>
<column style="border: 10px inset red;"/>
</columns>
<rows style="font-size: 20pt;">
<row>
<text value="Cell 1 "/>
<text value="Cell 2 "/>
<text value="Cell 3 "/>
</row>
<row>
<text value="Cell 4 "/>
<text value="Cell 5 " style="border: 10px inset red;"/>
<text value="Cell 6 "/>
</row>
<row>
<text value="Cell 7 "/>
<text value="Cell 8 "/>
<text value="Cell 9 "/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,52 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" id="grid">
<columns style="border: 0px solid blue">
<column/>
<column/>
<column/>
</columns>
<rows style="font-size: 40pt; border: 15px inset blue">
<row>
<text value="Cell(1)"/>
<text value="Cell(2)"/>
<text value="Cell(3)"/>
</row>
<rows style="border: 10px inset green">
<row>
<text value="Cell(1)"/>
<text value="Cell(2)"/>
<text value="Cell(3)"/>
</row>
<row>
<text value="Cell(4)"/>
<text value="Cell(5)"/>
<text value="Cell(6)"/>
</row>
<row>
<text value="Cell(7)"/>
<text value="Cell(8)"/>
<text value="Cell(9)"/>
</row>
</rows>
<row>
<text value="Cell(7)"/>
<text value="Cell(8)"/>
<text value="Cell(9)"/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,41 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="gridsample.css" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" id="grid">
<columns>
<column style="border: 10px solid red;"/>
<column/>
<column/>
</columns>
<rows style="font-size: 40pt;">
<row style="border: 10px solid red;">
<text value="Cell 1 "/>
<text value="Cell 2 "/>
<text value="Cell 3 "/>
</row>
<row>
<text value="Cell 4 "/>
<text value="Cell 5 "/>
<text value="Cell 6 "/>
</row>
<row>
<text value="Cell 7 "/>
<text value="Cell 8 "/>
<text value="Cell 9 "/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,54 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" id="grid">
<columns>
<column/>
<columns style="border: 10px solid red">
<column/>
</columns>
<column/>
</columns>
<rows style="font-size: 24pt">
<row>
<text value="Cell(1)"/>
<text value="Cell(2)"/>
<text value="Cell(3)"/>
</row>
<rows style="border: 10px solid green">
<row>
<text value="Cell(1)"/>
<text value="Cell(2)"/>
<text value="Cell(3)"/>
</row>
<row>
<text value="Cell(4)"/>
<text value="Cell(5)"/>
<text value="Cell(6)"/>
</row>
<row>
<text value="Cell(7)"/>
<text value="Cell(8)"/>
<text value="Cell(9)"/>
</row>
</rows>
<row>
<text value="Cell(7)"/>
<text value="Cell(8)"/>
<text value="Cell(9)"/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,41 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="gridsample.css" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" id="grid">
<columns>
<column style="border: 10px inset red; margin: 10px; "/>
<column/>
<column/>
</columns>
<rows style="font-size: 40pt;">
<row style="border: 5px solid green">
<text value="Cell 1"/>
<text value="Cell 2"/>
<text value="Cell 3"/>
</row>
<row>
<text value="Cell 4"/>
<text value="Cell 5"/>
<text value="Cell 6"/>
</row>
<row>
<text value="Cell 7"/>
<text value="Cell 8"/>
<text value="Cell 9"/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,64 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script>
function collapseTag(id)
{
var row = window.document.getElementById(id);
row.setAttribute("collapsed","true");
}
function uncollapseTag(id)
{
var row = window.document.getElementById(id);
row.setAttribute("collapsed","false");
}
</script>
<hbox>
<grid style="border: 2px solid red;" id="grid">
<columns id="columns1">
<column id="column1"/>
<column id="column2"/>
<column id="column3"/>
</columns>
<rows id="rows1" style="font-size: 24pt">
<row id="row1">
<text value="cell1"/>
<text value="cell2"/>
<text value="cell3"/>
</row>
<row id="row2">
<text value="cell4"/>
<text value="cell5"/>
<text value="cell6"/>
</row>
<row id="row3">
<text value="cell7"/>
<text value="cell8"/>
<text value="cell9"/>
</row>
</rows>
</grid>
</hbox>
<hbox>
<button label="collapse row 2" oncommand="collapseTag('row2');"/>
<button label="uncollapse row 2" oncommand="uncollapseTag('row2');"/>
<button label="collapse column 2" oncommand="collapseTag('column2');"/>
<button label="uncollapse column 2" oncommand="uncollapseTag('column2');"/>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,30 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px solid red;">
<columns>
<column/>
<description style="border: 10px inset gray">
hello
</description>
<column/>
</columns>
<rows>
<row>
<text style="font-size: 40px" value="foo1"/>
<text style="font-size: 40px" value="foo2"/>
</row>
</rows>
</grid>
<spacer flex="1" style="background-color: white"/>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,33 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="width: 100px; border: 2px solid red;">
<rows>
<row style="font-size: 40px">
<text value="foo1"/>
<text value="foo2"/>
</row>
<description>
this is some html in the row this should wrap if it is big enough.
</description>
<row style="font-size: 40px">
<text value="foo3"/>
<text value="foo4"/>
</row>
</rows>
</grid>
<spacer flex="1" style="background-color: white"/>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,367 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="gridsample.css" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
onload="start()">
<script>
var selected;
var count = 0;
function isCell(box)
{
if (box.localName == "row" ||
box.localName == "column" ||
box.localName == "rows" ||
box.localName == "columns" ||
box.localName == "grid")
return false;
return true;
}
function start()
{
selectIt(window.document.getElementById("rows"));
}
function selectIt(box)
{
if (!box)
return;
var a = box.getAttribute("selected");
if (a != "true") {
box.setAttribute("selected","true");
if (selected)
selected.setAttribute("selected","false");
selected = box;
}
}
function addCellSelectionHandle(box)
{
box.setAttribute("oncommand", "selectIt(this);");
}
function addRowColumnSelectionHandle(box)
{
box.setAttribute("onclick", "selectIt(this);");
}
function createButton(str)
{
var b = document.createElement("button");
b.setAttribute("label", str+count);
count++;
addCellSelectionHandle(b);
return b;
}
function createRow()
{
var b = document.createElement("row");
b.setAttribute("dynamic","true");
addRowColumnSelectionHandle(b);
return b;
}
function createColumn()
{
var b = document.createElement("column");
b.setAttribute("dynamic","true");
addRowColumnSelectionHandle(b);
return b;
}
function createText(str)
{
var text = document.createElement("text");
text.setAttribute("value", str+count);
count++;
text.setAttribute("style", "font-size: 40pt");
addCellSelectionHandle(text);
return text;
}
function appendElement(element, prepend)
{
if (!selected)
return;
setUserAttribute(element);
if (selected.localName == "rows")
appendRow(false);
else if (selected.localName == "columns")
appendColumn(false);
if (selected.localName == "row" || selected.localName == "column" ) { // is row or column
selected.appendChild(element);
} else {
var parent = selected.parentNode;
if (prepend)
parent.insertBefore(element, selected);
else {
var next = selected.nextSibling;
if (next)
parent.insertBefore(element,next);
else
parent.appendChild(element);
}
}
selectIt(element);
}
function getRows(box)
{
return window.document.getElementById("rows");
}
function getColumns(box)
{
return window.document.getElementById("columns");
}
function setUserAttribute(element)
{
var attributeBox = document.getElementById("attributebox");
var valueBox = document.getElementById("valuebox");
var attribute = attributeBox.value;
var value = valueBox.value;
if (attribute != "")
element.setAttribute(attribute,value);
}
function appendRowColumn(rowColumn, prepend)
{
if (!selected)
return;
setUserAttribute(rowColumn);
var row = rowColumn;
// first see what we are adding.
if (isCell(selected)) { // if cell then select row/column
selectIt(selected.parentNode);
}
if (selected.localName == "row" || selected.localName == "rows")
if (row.localName == "column") {
selectIt(getColumns(selected));
dump("Selecting the column")
dump("Selected="+selected.localName);
}
if (selected.localName == "column" || selected.localName == "columns")
if (row.localName == "row")
selectIt(getRows(selected));
if (selected.localName == "rows" || selected.localName == "columns" )
{ // if rows its easy
selected.appendChild(row);
} else {
var parent = selected.parentNode;
if (prepend)
parent.insertBefore(row, selected);
else {
var next = selected.nextSibling;
if (next)
parent.insertBefore(row,next);
else
parent.appendChild(row);
}
}
selectIt(row);
}
function appendRow(prepend)
{
var row = createRow();
appendRowColumn(row,prepend);
}
function appendColumn(prepend)
{
var column = createColumn();
appendRowColumn(column,prepend);
}
function selectRows()
{
var rows = getRows();
if (rows.firstChild)
selectIt(rows.firstChild);
else
selectIt(rows);
}
function selectColumns()
{
var columns = getColumns();
if (columns.firstChild)
selectIt(columns.firstChild);
else
selectIt(columns);
}
function nextElement()
{
if (!selected)
return;
selectIt(selected.nextSibling);
}
function previousElement()
{
if (!selected)
return;
selectIt(selected.previousSibling);
}
function selectRow()
{
if (!selected)
return;
if (selected.localName == "row")
return;
if (isCell(selected)) {
if (selected.parentNode.localName == "row")
selectIt(selected.parentNode);
}
}
function selectColumn()
{
if (!selected)
return;
if (selected.localName == "column")
return;
if (isCell(selected)) {
if (selected.parentNode.localName == "column")
selectIt(selected.parentNode);
}
}
function collapseGrid()
{
var grid = document.getElementById("grid");
var collapsed = grid.getAttribute("collapsed");
if (collapsed == "")
grid.setAttribute("collapsed","true");
else
grid.setAttribute("collapsed","");
}
function collapseElement()
{
if (selected) {
var collapsed = selected.getAttribute("collapsed");
if (collapsed == "")
selected.setAttribute("collapsed","true");
else
selected.setAttribute("collapsed","");
}
}
</script>
<hbox flex="1" style="border: 2px inset gray; overflow: auto">
<vbox flex="1">
<hbox>
<grid id="grid" style="border: 2px solid red;">
<columns id="columns">
</columns>
<rows start="true" id="rows">
</rows>
</grid>
<spacer flex="1"/>
</hbox>
<spacer flex="1"/>
</vbox>
</hbox>
<grid style="background-color: blue">
<columns>
<column flex="1"/>
<column flex="1"/>
<column flex="1"/>
<column flex="1"/>
</columns>
<rows>
<row>
<button label="append row" oncommand="appendRow(false);"/>
<button label="prepend row" oncommand="appendRow(true);"/>
<button label="append column" oncommand="appendColumn(false);"/>
<button label="prepend column" oncommand="appendColumn(true);"/>
</row>
<row>
<button label="append button" oncommand="appendElement(createButton('button'),false);"/>
<button label="prepend button" oncommand="appendElement(createButton('button'),true);"/>
<button label="append text" oncommand="appendElement(createText('text'),false);"/>
<button label="prepend text" oncommand="appendElement(createText('text'),true);"/>
</row>
<row>
<button label="select rows" oncommand="selectRows()"/>
<button label="select columns" oncommand="selectColumns()"/>
<button label="next" oncommand="nextElement()"/>
<button label="previous" oncommand="previousElement()"/>
</row>
<hbox valign="middle" autostretch="never">
<button label="collapse/uncollapse grid" flex="1" oncommand="collapseGrid()"/>
<button label="collapse/uncollapse element" flex="1" oncommand="collapseElement()"/>
</hbox>
<hbox>
<text value="attribute"/>
<textbox id="attributebox" value="" flex="1"/>
<text value="value"/>
<textbox id="valuebox" value="" flex="2"/>
</hbox>
</rows>
</grid>
</window>

Просмотреть файл

@ -0,0 +1,44 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="gridsample.css" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px inset gray;" flex="1">
<columns>
<columns style="border: 10px solid red" flex="1">
<column flex="2"/>
<column flex="1"/>
</columns>
<column flex="1"/>
</columns>
<rows style="font-size: 20pt">
<rows>
<row>
<text class="yellow" value="CellA"/>
<text class="yellow" value="CellAB"/>
<text class="yellow" value="CellABC"/>
</row>
<row>
<text class="yellow" value="CellA"/>
<text class="yellow" value="CellAB"/>
<text class="yellow" value="CellABC"/>
</row>
</rows>
<row>
<text class="yellow" value="CellA"/>
<text class="yellow" value="CellAB"/>
<text class="yellow" value="CellABC"/>
</row>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,39 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script>
function start()
{
var row = document.getElementById("row");
var text = document.createElement("text");
text.setAttribute("value", "foo");
row.appendChild(text);
}
</script>
<hbox>
<grid style="border: 2px solid red;" id="grid">
<columns>
</columns>
<rows>
<row id="row">
<button label="value"/>
</row>
</rows>
</grid>
<spacer flex="1" style="background-color: white"/>
</hbox>
<button label="insert" oncommand="start()"/>
</window>

Просмотреть файл

@ -0,0 +1,79 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="gridsample.css" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script>
function flip(child)
{
var jump = child.getAttribute("jumpy");
if (jump != "true")
child.setAttribute("jumpy","true");
else
child.setAttribute("jumpy","false");
}
</script>
<hbox>
<grid style="border: 2px solid yellow;">
<columns>
</columns>
<rows>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
<row>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
<button label="button" class="jumpy"/>
</row>
</rows>
</grid>
<spacer style="border: 2px solid white;" flex="1"/>
</hbox>
<spacer style="border: 2px solid white;" flex="1"/>
</window>

Просмотреть файл

@ -0,0 +1,45 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox flex="1">
<grid style="border: 2px solid red" flex="1">
<columns>
<column flex="1"/>
<column flex="1"/>
<column flex="1"/>
</columns>
<rows>
<row>
<text value="out1"/>
<text value="out2"/>
<text value="out3"/>
</row>
<rows flex="1" style="border: 10px inset yellow; font-size: 20pt">
<row>
<text value="in1"/>
<text value="in2"/>
<text value="in3"/>
</row>
<row>
<text value="in4"/>
<text value="in5"/>
<text value="in5"/>
</row>
</rows>
</rows>
</grid>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,38 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px solid red;">
<columns>
<column/>
<column/>
</columns>
<rows>
<row style="font-size: 40px">
<text value="foo1"/>
<text value="foo2"/>
</row>
<box width="50" style="border:5px inset grey">
<text value="hello there. This spans"/>
</box>
<row style="font-size: 40px" >
<text value="foo1"/>
<text value="foo2"/>
</row>
</rows>
</grid>
<spacer flex="1" style="background-color: white"/>
</hbox>
</window>

Просмотреть файл

@ -0,0 +1,77 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox flex="1">
<grid style="border: 2px solid red" flex="1">
<rows>
<row flex="1"/>
<row flex="1"/>
<row flex="1"/>
</rows>
<columns>
<column>
<button label="left"/>
<button label="left"/>
<button label="left"/>
</column>
<columns flex="1" style="min-width: 1px; overflow: auto; background-color: green">
<column>
<button label="cell1"/>
<button label="cell1"/>
<button label="cell1"/>
</column>
<column>
<button label="cell2"/>
<button label="cell2"/>
<button label="cell2"/>
</column>
<column>
<button label="cell3"/>
<button label="cell3"/>
<button label="cell3"/>
</column>
<column>
<button label="cell4"/>
<button label="cell4"/>
<button label="cell4"/>
</column>
<column>
<button label="cell5"/>
<button label="cell5"/>
<button label="cell5"/>
</column>
<column>
<button label="cell6"/>
<button label="cell6"/>
<button label="cell6"/>
</column>
<column>
<button label="cell7"/>
<button label="cell7"/>
<button label="cell7"/>
</column>
</columns>
<column>
<button label="right"/>
<button label="right"/>
<button label="right"/>
</column>
</columns>
</grid>
<spacer width="100"/>
</hbox>
<spacer height="100"/>
</window>

Просмотреть файл

@ -0,0 +1,77 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox flex="1">
<grid style="border: 2px solid red" flex="1">
<columns>
<column flex="1"/>
<column flex="1"/>
<column flex="1"/>
</columns>
<rows>
<row>
<button label="left"/>
<button label="left"/>
<button label="left"/>
</row>
<rows flex="1" style="border: 10px inset gray; overflow: auto; background-color: green">
<row>
<button label="cell1"/>
<button label="cell1"/>
<button label="cell1"/>
</row>
<row>
<button label="cell2"/>
<button label="cell2"/>
<button label="cell2"/>
</row>
<row>
<button label="cell3"/>
<button label="cell3"/>
<button label="cell3"/>
</row>
<row>
<button label="cell4"/>
<button label="cell4"/>
<button label="cell4"/>
</row>
<row>
<button label="cell5"/>
<button label="cell5"/>
<button label="cell5"/>
</row>
<row>
<button label="cell6"/>
<button label="cell6"/>
<button label="cell6"/>
</row>
<row>
<button label="cell7"/>
<button label="cell7"/>
<button label="cell7"/>
</row>
</rows>
<row>
<button label="right"/>
<button label="right"/>
<button label="right"/>
</row>
</rows>
</grid>
<spacer width="100"/>
</hbox>
<spacer height="100"/>
</window>

Просмотреть файл

@ -0,0 +1,37 @@
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE window>
<window orient="vertical" style="border: 2px solid green"
xmlns:html="http://www.w3.org/TR/REC-html40"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox>
<grid style="border: 2px solid red;">
<columns>
<column style="min-width: 1px"/>
<splitter/>
<column style="min-width: 1px"/>
</columns>
<rows>
<row>
<text style="font-size: 40px" value="foo1"/>
<text style="font-size: 40px" value="foo2"/>
</row>
<label value="this is some text. This is longer"/>
<row>
<text style="font-size: 40px" value="foo1"/>
<text style="font-size: 40px" value="foo2"/>
</row>
</rows>
</grid>
<spacer flex="1" style="background-color: white"/>
</hbox>
</window>