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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
|
import QtQuick 2.0
// positioning all elements manually.
Rectangle {
id: p
color: "red"
width: 400
height: 800
Rectangle {
id: c
color: "blue"
width: 400
height: 400
y: 400
Rectangle {
id: n1
color: "green"
width: 200
height: 100
x: 0
y: 200
}
Rectangle {
id: n2
color: "cyan"
width: 200
height: 100
x: 200
y: 200
}
Rectangle {
id: n3
color: "aquamarine"
width: 200
height: 100
x: 0
y: 300
}
Rectangle {
id: n4
color: "lightgreen"
width: 200
height: 100
x: 200
y: 300
}
}
// for visually determining correctness.
//Timer {
// property int count: 0
// interval: 1000
// running: true
// repeat: true
// onTriggered: {
// if (count == 0) {
// count = 1;
// // expand
// p.height = 800
// c.height = 400
// c.y = 400
// n1.height = 100
// n1.y = 200
// n2.height = 100
// n2.y = 200
// n3.height = 100
// n3.y = 300
// n4.height = 100
// n4.y = 300
// } else {
// count = 0;
// // shrink
// p.height = 400
// c.height = 200
// c.y = 200
// n1.height = 50
// n1.y = 100
// n2.height = 50
// n2.y = 100
// n3.height = 50
// n3.y = 150
// n4.height = 50
// n4.y = 150
// }
// }
//}
Component.onCompleted: {
// expand
p.height = 800
c.height = 400
c.y = 400
n1.height = 100
n1.y = 200
n2.height = 100
n2.y = 200
n3.height = 100
n3.y = 300
n4.height = 100
n4.y = 300
// shrink
p.height = 400
c.height = 200
c.y = 200
n1.height = 50
n1.y = 100
n2.height = 50
n2.y = 100
n3.height = 50
n3.y = 150
n4.height = 50
n4.y = 150
}
}
|
