blob: 92de813d8a275b811b8626cf3f422e6b834cd0f1 (
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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
|
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls.Basic
import QtQuick.Effects
Item {
// Height, width and any other size related properties containing odd looking float or other dividers
// that do not seem to have any logical origin are just arbitrary and based on original design
// and/or personal preference on what looks nice.
id: root
property alias grid: grid
property alias greenBar: greenBar
property alias cup: cup
property alias caption: caption
property alias contentItem: contentItem
property int maxCoffee
property int maxmilk
property int maxFoam
property int coffeeAmount
property int milkAmount
property int foamAmount
property double sugarAmount
property double progressBarValue: 0
states: [
State {
name: "portrait"
PropertyChanges {
target: cup
Layout.alignment: Qt.AlignCenter | Qt.AlignTop
Layout.preferredWidth: height / 1.16
Layout.preferredHeight: root.height / 3
}
PropertyChanges {
target: dialog
Layout.preferredWidth: root.width / 1.12
Layout.preferredHeight: root.height / 7
}
},
State {
name: "landscape"
PropertyChanges {
target: grid
rowSpacing: 10
}
PropertyChanges {
target: cup
Layout.alignment: Qt.AlignCenter | Qt.AlignTop
Layout.preferredWidth: height / 1.16
Layout.preferredHeight: root.height / 2.5
}
PropertyChanges {
target: dialog
Layout.preferredWidth: root.width / 2.5
Layout.preferredHeight: root.height / 5
}
PropertyChanges {
target: control
Layout.bottomMargin: 10
}
}
]
GridLayout {
id: grid
rowSpacing: 20
anchors.horizontalCenter: parent.horizontalCenter
flow: GridLayout.TopToBottom
//! [Cup]
Cup {
id: cup
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
state: "0"
}
//! [Cup]
Rectangle {
id: dialog
radius: 8
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
gradient: Colors.greyBorder
Layout.minimumHeight: 30
Layout.minimumWidth: 350
Rectangle {
id: rectangle
width: parent.width - 2
height: parent.height - 2
radius: 8
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
color: Colors.currentTheme.cardColor
Text {
id: caption
text: "Your coffee is being prepared..."
color: Colors.currentTheme.textColor
font.pixelSize: 18
font.weight: 600
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
}
}
MultiEffect {
source: rectangle
anchors.fill: rectangle
shadowEnabled: true
shadowColor: Colors.shadow
shadowOpacity: 0.5
}
}
ProgressBar {
id: control
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
value: progressBarValue
Layout.topMargin: 20
background: Rectangle {
implicitHeight: 2
color: "#e6e6e6"
}
contentItem: Item {
id: contentItem
implicitWidth: dialog.width / 1.5
implicitHeight: 2
Rectangle {
id: greenBar
width: control.visualPosition * parent.width
height: parent.height
color: Colors.green
}
Image {
id: circle
source: (Colors.currentTheme == Colors.dark) ? "./images/icons/ellipse_dark.svg" : "./images/icons/ellipse_light.svg"
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.left
}
Image {
id: circle2
source: (Colors.currentTheme == Colors.dark) ? "./images/icons/ellipse_dark.svg" : "./images/icons/ellipse_light.svg"
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
}
Image {
id: circle3
source: (Colors.currentTheme == Colors.dark) ? "./images/icons/ellipse_dark.svg" : "./images/icons/ellipse_light.svg"
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.right
}
Text {
text: "0%"
font.pixelSize: 12
anchors.horizontalCenter: circle.horizontalCenter
anchors.verticalCenter: circle.verticalCenter
color: Colors.currentTheme.textColor
}
Text {
text: "50%"
font.pixelSize: 12
anchors.horizontalCenter: circle2.horizontalCenter
anchors.verticalCenter: circle2.verticalCenter
color: Colors.currentTheme.textColor
}
Text {
text: "100%"
font.pixelSize: 12
anchors.horizontalCenter: circle3.horizontalCenter
anchors.verticalCenter: circle3.verticalCenter
color: Colors.currentTheme.textColor
}
}
}
Text {
color: Colors.green
text: qsTr("Brewing...")
Layout.alignment: Qt.AlignHCenter
font.pixelSize: 12
font.weight: 600
}
}
}
|