3 <meta http-equiv=
"Content-Type" content=
"text/html; charset=utf-8" />
4 <title>qooxdoo
» Demo
</title>
5 <link type=
"text/css" rel=
"stylesheet" href=
"../../resource/css/layout.css"/>
7 <link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
9 <script type=
"text/javascript" src=
"../../script/qx.js"></script>
12 <script type=
"text/javascript" src=
"../../script/layout.js"></script>
14 <div id=
"demoDescription">
15 <p>Test for qx.ui.layout.GridLayout.
</p>
16 <p>Using percents for children.
</p>
19 <script type=
"text/javascript">
20 qx
.core
.Init
.getInstance().defineMain(function()
22 var gl
= new qx
.ui
.layout
.GridLayout
;
24 gl
.setLocation(20, 48);
27 gl
.setBorder(qx
.renderer
.border
.BorderPresets
.getInstance().outset
);
32 gl
.setColumnWidth(0, "10%");
33 gl
.setColumnWidth(1, "40%");
34 gl
.setColumnWidth(2, "30%");
35 gl
.setColumnWidth(3, "20%");
37 gl
.setRowHeight(0, "70%");
38 gl
.setRowHeight(1, "30%");
40 qx
.ui
.core
.ClientDocument
.getInstance().add(gl
);
46 var term1
= new qx
.ui
.basic
.Terminator
;
47 term1
.setBackgroundColor("yellow");
50 var term2
= new qx
.ui
.basic
.Terminator
;
51 term2
.setBackgroundColor("red");
54 var term3
= new qx
.ui
.basic
.Terminator
;
55 term3
.setBackgroundColor("green");
58 var term4
= new qx
.ui
.basic
.Terminator
;
59 term4
.setBackgroundColor("blue");
62 var term5
= new qx
.ui
.basic
.Terminator
;
63 term5
.setBackgroundColor("fuchsia");
66 var term6
= new qx
.ui
.basic
.Terminator
;
67 term6
.setBackgroundColor("olive");
70 var term7
= new qx
.ui
.basic
.Terminator
;
71 term7
.setBackgroundColor("maroon");
74 var term8
= new qx
.ui
.basic
.Terminator
;
75 term8
.setBackgroundColor("navy");