blob: e675849dd36190136562a7dede35f553bbc547b8 (
plain)
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
|
..
---------------------------------------------------------------------------
Copyright (C) 2012 Digia Plc and/or its subsidiary(-ies).
All rights reserved.
This work, unless otherwise expressly stated, is licensed under a
Creative Commons Attribution-ShareAlike 2.5.
The full license document is available from
http://creativecommons.org/licenses/by-sa/2.5/legalcode .
---------------------------------------------------------------------------
How to make and handle multiple toplevel windows
================================================
You can use the ``visible`` or the ``opacity`` property to hide a toplevel element. Visually, both choices look the same. The only difference is that the ``visible`` property changes the focus behavior. You should keep this in mind and check what is better in your case.
A simple version without any control elements:
.. code-block:: js
import QtQuick 1.1
Item {
width: 360
height: 360
Rectangle {
id: top1
anchors.fill: parent
Text {
anchors.centerIn: parent
text: "I'm top #1, click me to hide"
}
MouseArea {
anchors.fill: parent
onClicked: {
top1.visible=false
top2.visible=true
}
}
}
Rectangle {
id: top2
anchors.fill: parent
Text {
anchors.centerIn: parent
text: "I'm top #2, click me to hide"
}
MouseArea {
anchors.fill: parent
onClicked: {
top2.visible=false
top1.visible=true
}
}
}
}
A more complex version with a component for a button:
.. code-block:: js
import QtQuick 1.1
Rectangle {
id: root
property string label: "no label"
width: labelText.width + 10
height: labelText.height + 10
color: "red"
radius: 8
signal clicked()
Text {
id: labelText
text: label
anchors.centerIn: parent
}
MouseArea {
anchors.fill: parent
onClicked: root.clicked()
}
}
.. code-block:: js
import QtQuick 1.1
Item {
width: 360
height: 360
Rectangle {
id: top1
anchors.fill: parent
Text {
anchors.centerIn: parent
text: "I'm top #1"
}
Button2 {
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter
color: "lightblue"
label: "Open top 2"
onClicked: {
top1.visible=false
top2.visible=true
}
}
}
Rectangle {
id: top2
anchors.fill: parent
Text {
anchors.centerIn: parent
text: "I'm top #2"
}
Button2 {
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter
color: "lightgrey"
label: "Open top 1"
onClicked: {
top2.visible=false
top1.visible=true
}
}
}
}
|