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
|
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
pragma ComponentBehavior: Bound
ApplicationWindow {
id: appWindow
visible: true
title: qsTr("Basic layouts")
readonly property int margin: 11
Component.onCompleted: {
width = mainLayout.implicitWidth + 2 * margin
height = mainLayout.implicitHeight + 2 * margin
}
minimumWidth: mainLayout.Layout.minimumWidth + 2 * margin
minimumHeight: mainLayout.Layout.minimumHeight + 2 * margin
ColumnLayout {
id: mainLayout
anchors.fill: parent
anchors.margins: appWindow.margin
GroupBox {
id: rowBox
title: qsTr("Row layout")
Layout.minimumWidth: rowLayout.Layout.minimumWidth + 30
RowLayout {
id: rowLayout
anchors.fill: parent
TextField {
placeholderText: qsTr("This wants to grow horizontally")
}
Button {
text: qsTr("Button")
}
}
}
GroupBox {
id: gridBox
title: qsTr("Grid layout")
Layout.minimumWidth: gridLayout.Layout.minimumWidth + 30
GridLayout {
id: gridLayout
rows: 3
flow: GridLayout.TopToBottom
anchors.fill: parent
Label { text: qsTr("Line 1") }
Label { text: qsTr("Line 2") }
Label { text: qsTr("Line 3") }
TextField { }
TextField { }
TextField { }
TextArea {
text: qsTr("This widget spans over three rows in the GridLayout.\n")
+ qsTr("All items in the GridLayout are implicitly positioned from top to bottom.")
wrapMode: TextArea.WordWrap
Layout.rowSpan: 3
Layout.minimumHeight: implicitHeight
Layout.minimumWidth: 100 // guesstimate, should be size of largest word
}
}
}
TextArea {
id: t3
text: qsTr("This fills the whole cell")
Layout.minimumHeight: 30
}
GroupBox {
id: stackBox
title: qsTr("Stack layout")
implicitWidth: 200
implicitHeight: 60
Layout.minimumHeight: 60
StackLayout {
id: stackLayout
anchors.fill: parent
function advance() { currentIndex = (currentIndex + 1) % count }
Repeater {
id: stackRepeater
model: 5
Rectangle {
required property int index
color: Qt.hsla((0.5 + index) / stackRepeater.count, 0.3, 0.7, 1)
Button {
anchors.centerIn: parent
text: qsTr("Page ") + (parent.index + 1)
onClicked: stackLayout.advance()
}
}
}
}
}
}
}
|
