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 Same as the previous one, but additional added multiple children to the box layout.
18 <script type="text/javascript">
19 qx.core.Init.getInstance().defineMain(function()
21 var d = qx.ui.core.ClientDocument.getInstance();
23 var dl1 = new qx.ui.layout.DockLayout;
30 dl1.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
31 dl1.setBackgroundColor("white");
37 var t1 = new qx.ui.layout.HorizontalBoxLayout;
39 t1.setBackgroundColor("red");
41 t1.setVerticalChildrenAlign("middle");
42 t1.setHorizontalChildrenAlign("center");
44 t1.add(new qx.ui.basic.Image("icon/16/clock.png"));
45 t1.add(new qx.ui.basic.Label("Hello World"));
46 t1.add(new qx.ui.basic.Image("icon/48/colors.png"));
49 var t2 = new qx.ui.layout.HorizontalBoxLayout;
51 t2.setBackgroundColor("yellow");
53 t2.setVerticalChildrenAlign("middle");
54 t2.setHorizontalChildrenAlign("center");
56 t2.add(new qx.ui.basic.Image("icon/16/clock.png"));
57 t2.add(new qx.ui.basic.Label("Hello World"));
58 t2.add(new qx.ui.basic.Image("icon/48/colors.png"));
61 var t3 = new qx.ui.layout.HorizontalBoxLayout;
63 t3.setBackgroundColor("blue");
65 t3.setVerticalChildrenAlign("middle");
66 t3.setHorizontalChildrenAlign("center");
68 t3.add(new qx.ui.basic.Image("icon/16/clock.png"));
69 t3.add(new qx.ui.basic.Label("Hello World"));
70 t3.add(new qx.ui.basic.Image("icon/48/colors.png"));
73 var t4 = new qx.ui.layout.HorizontalBoxLayout;
75 t4.setBackgroundColor("green");
77 t4.setVerticalChildrenAlign("middle");
78 t4.setHorizontalChildrenAlign("center");
80 t4.add(new qx.ui.basic.Image("icon/16/clock.png"));
81 t4.add(new qx.ui.basic.Label("Hello World"));
82 t4.add(new qx.ui.basic.Image("icon/48/colors.png"));
88 var dl2 = new qx.ui.layout.DockLayout;
89 dl2.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
98 var t5 = new qx.ui.layout.HorizontalBoxLayout;
100 t5.setBackgroundColor("fuchsia");
102 t5.setVerticalChildrenAlign("middle");
103 t5.setHorizontalChildrenAlign("center");
105 t5.add(new qx.ui.basic.Image("icon/16/clock.png"));
106 t5.add(new qx.ui.basic.Label("Hello World"));
107 t5.add(new qx.ui.basic.Image("icon/48/colors.png"));
110 var t6 = new qx.ui.layout.HorizontalBoxLayout;
112 t6.setBackgroundColor("orange");
114 t6.setVerticalChildrenAlign("middle");
115 t6.setHorizontalChildrenAlign("center");
117 t6.add(new qx.ui.basic.Image("icon/16/clock.png"));
118 t6.add(new qx.ui.basic.Label("Hello World"));
119 t6.add(new qx.ui.basic.Image("icon/48/colors.png"));
122 var t7 = new qx.ui.layout.HorizontalBoxLayout;
124 t7.setBackgroundColor("aqua");
126 t7.setVerticalChildrenAlign("middle");
127 t7.setHorizontalChildrenAlign("center");
129 t7.add(new qx.ui.basic.Image("icon/16/clock.png"));
130 t7.add(new qx.ui.basic.Label("Hello World"));
131 t7.add(new qx.ui.basic.Image("icon/48/colors.png"));
134 var t8 = new qx.ui.layout.HorizontalBoxLayout;
136 t8.setBackgroundColor("lime");
138 t8.setVerticalChildrenAlign("middle");
139 t8.setHorizontalChildrenAlign("center");
141 t8.add(new qx.ui.basic.Image("icon/16/clock.png"));
142 t8.add(new qx.ui.basic.Label("Hello World"));
143 t8.add(new qx.ui.basic.Image("icon/48/colors.png"));
150 var hb1 = new qx.ui.layout.HorizontalBoxLayout;
152 hb1.setBackgroundColor("silver");
153 hb1.setVerticalChildrenAlign("middle");
154 hb1.setHorizontalChildrenAlign("center");
155 hb1.setBorder(qx.renderer.border.BorderPresets.getInstance().black);
158 hb1.add(new qx.ui.basic.Image("icon/64/clock.png"));