1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>qooxdoo » Demo</title>
<link type="text/css" rel="stylesheet" href="../../resource/css/layout.css"/>
<!--[if IE]>
<link type="text/css" rel="stylesheet" href="../../resource/css/layout_ie.css"/>
<![endif]-->
<script type="text/javascript" src="../../script/qx.js"></script>
</head>
<body>
<script type="text/javascript" src="../../script/layout.js"></script>
<div id="demoDescription">
<p>Yet Another qx.ui.pageview.buttonview.ButtonView Example</p>
</div>
<script type="text/javascript">
qx.core.Init.getInstance().defineMain(function()
{
var d = qx.ui.core.ClientDocument.getInstance();
var bs = new qx.ui.pageview.buttonview.ButtonView;
bs.set({ left: 20, top: 48, right: 335, bottom: 48 });
bs.setBarPosition("left");
var bsb1 = new qx.ui.pageview.buttonview.ButtonViewButton("Display", "icon/16/display.png");
var bsb2 = new qx.ui.pageview.buttonview.ButtonViewButton("Organizer", "icon/16/organizer.png");
var bsb3 = new qx.ui.pageview.buttonview.ButtonViewButton("Colorize", "icon/16/colors.png");
var bsb4 = new qx.ui.pageview.buttonview.ButtonViewButton("Icons", "icon/16/icons.png");
var bsb5 = new qx.ui.pageview.buttonview.ButtonViewButton("Paint", "icon/16/paint.png");
var bsb6 = new qx.ui.pageview.buttonview.ButtonViewButton("Applications", "icon/16/run.png");
var bsb7 = new qx.ui.pageview.buttonview.ButtonViewButton("System", "icon/16/control-center.png");
bsb1.setChecked(true);
bsb1.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb2.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb3.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb4.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb5.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb6.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bsb7.set({ iconPosition: "left", horizontalChildrenAlign: "left" });
bs.getBar().add(bsb1, bsb2, bsb3, bsb4, bsb5, bsb6, bsb7);
bs.getBar().setHorizontalChildrenAlign("center");
bs.getBar().setVerticalChildrenAlign("bottom");
var p1 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb1);
var p2 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb2);
var p3 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb3);
var p4 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb4);
var p5 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb5);
var p6 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb6);
var p7 = new qx.ui.pageview.buttonview.ButtonViewPage(bsb7);
bs.getPane().add(p1, p2, p3, p4, p5, p6, p7);
var f1 = new qx.ui.form.TextField("Display Input");
var f2 = new qx.ui.form.TextField("Sunshine Input");
var f3 = new qx.ui.form.TextField("Paint Input");
var f4 = new qx.ui.form.TextField("Icons Input");
var f5 = new qx.ui.form.TextField("Images Input");
var f6 = new qx.ui.form.TextField("Applications Input");
var f7 = new qx.ui.form.TextField("System Input");
p1.add(f1);
p2.add(f2);
p3.add(f3);
p4.add(f4);
p5.add(f5);
p6.add(f6);
p7.add(f7);
var r1 = new qx.ui.form.RadioButton("Top", "top");
var r2 = new qx.ui.form.RadioButton("Right", "right");
var r3 = new qx.ui.form.RadioButton("Bottom", "bottom");
var r4 = new qx.ui.form.RadioButton("Left", "left", null, true);
r1.setTop(50);
r2.setTop(70);
r3.setTop(90);
r4.setTop(110);
p1.add(r1, r2, r3, r4);
var rm = new qx.manager.selection.RadioManager(null, [r1, r2, r3, r4]);
rm.addEventListener("changeSelected", function(e) {
bs.setBarPosition(e.getData().getValue());
});
d.add(bs);
});
</script>
</body>
</html>
|
