diff options
Diffstat (limited to 'webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/GridLayout_6.html')
-rw-r--r-- | webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/GridLayout_6.html | 109 |
1 files changed, 109 insertions, 0 deletions
diff --git a/webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/GridLayout_6.html b/webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/GridLayout_6.html new file mode 100644 index 0000000000..786cd9927a --- /dev/null +++ b/webapps/qooxdoo-0.6.5-sdk/frontend/application/sample/source/html/test/GridLayout_6.html @@ -0,0 +1,109 @@ +<html> +<head> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <title>qooxdoo » Demo » Sample</title> + <link type="text/css" rel="stylesheet" href="../../css/layout.css"/> + <!--[if IE]> + <link type="text/css" rel="stylesheet" href="../../css/layout_ie.css"/> + <![endif]--> + <script type="text/javascript" src="../../script/sample.js"></script> +</head> +<body> + <script type="text/javascript" src="../../script/layout.js"></script> + + <div id="demoDescription"> + <p>A simple form using qx.ui.layout.GridLayout</p> + <p>Using padding instead of spacing. Spacing is between the cells, padding is inside the cells. The same layout using padding is always bigger because the first and last cells are also affected with the padding to the edge.</p> + </div> + + <script type="text/javascript"> + qx.core.Init.getInstance().defineMain(function() + { + var gl = new qx.ui.layout.GridLayout; + + gl.setLocation(20, 48); + gl.setDimension("auto", "auto"); + gl.setBorder(qx.renderer.border.BorderPresets.getInstance().outset); + gl.setPadding(8); + gl.setColumnCount(2); + gl.setRowCount(7); + + gl.setColumnWidth(0, 76); + gl.setColumnWidth(1, 186); + + gl.setColumnHorizontalAlignment(0, "right"); + gl.setColumnVerticalAlignment(0, "middle"); + + gl.setRowHeight(0, 24); + gl.setRowHeight(1, 24); + gl.setRowHeight(2, 24); + gl.setRowHeight(3, 24); + gl.setRowHeight(4, 24); + gl.setRowHeight(5, 74); + gl.setRowHeight(6, 24); + + gl.setCellPaddingTop(2); + gl.setCellPaddingRight(3); + gl.setCellPaddingBottom(2); + gl.setCellPaddingLeft(3); + + /* + + // the same like the above, but more local + gl.setColumnPaddingTop(0, 2); + gl.setColumnPaddingRight(0, 3); + gl.setColumnPaddingBottom(0, 2); + gl.setColumnPaddingLeft(0, 3); + + gl.setColumnPaddingTop(1, 2); + gl.setColumnPaddingRight(1, 3); + gl.setColumnPaddingBottom(1, 2); + gl.setColumnPaddingLeft(1, 3); + + */ + + qx.ui.core.ClientDocument.getInstance().add(gl); + + var label1 = new qx.ui.basic.Label("Given Name"); + var label2 = new qx.ui.basic.Label("Name"); + var label3 = new qx.ui.basic.Label("City"); + var label4 = new qx.ui.basic.Label("Country"); + var label5 = new qx.ui.basic.Label("E-Mail"); + var label6 = new qx.ui.basic.Label("Comment"); + + label6.setVerticalAlign("top"); + + var input1 = new qx.ui.form.TextField; + var input2 = new qx.ui.form.TextField; + var input3 = new qx.ui.form.ComboBox; + var input4 = new qx.ui.form.TextField; + var input5 = new qx.ui.form.TextField; + var input6 = new qx.ui.form.TextArea; + var input7 = new qx.ui.form.Button("Submit", "icon/16/actions/dialog-ok.png"); + + input3.add(new qx.ui.form.ListItem("New York")); + input3.add(new qx.ui.form.ListItem("Paris")); + input3.add(new qx.ui.form.ListItem("Sydney")); + input3.add(new qx.ui.form.ListItem("Berlin")); + input3.add(new qx.ui.form.ListItem("Washington")); + + input7.setHorizontalAlign("right"); + + gl.add(label1, 0, 0); + gl.add(input1, 1, 0); + gl.add(label2, 0, 1); + gl.add(input2, 1, 1); + gl.add(label3, 0, 2); + gl.add(input3, 1, 2); + gl.add(label4, 0, 3); + gl.add(input4, 1, 3); + gl.add(label5, 0, 4); + gl.add(input5, 1, 4); + gl.add(label6, 0, 5); + gl.add(input6, 1, 5); + gl.add(input7, 1, 6); + }); + </script> + +</body> +</html> |