blob: 35208026df4d47e76278a4112e8b3c9e94023876 (
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
|
// Copyright (C) 2021 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Controls
import Hangman
Rectangle {
id: storeItem
property Product product: undefined
state: "NORMAL"
visible: product.status == Product.Registered
radius: 10
color: "white"
height: titleText.contentHeight + descriptionText.contentHeight + topLevel.globalMargin * 2
// ![0]
Text {
id: titleText
text: product.title
font.bold: true
anchors.right: priceText.left
anchors.rightMargin: topLevel.globalMargin
anchors.top: parent.top
anchors.topMargin: topLevel.globalMargin
anchors.left: parent.left
anchors.leftMargin: topLevel.globalMargin
}
Text {
id: descriptionText
text: product.description
anchors.right: priceText.left
anchors.rightMargin: topLevel.globalMargin
anchors.left: parent.left
anchors.leftMargin: topLevel.globalMargin
anchors.top: titleText.bottom
anchors.topMargin: topLevel.globalMargin / 2
wrapMode: Text.WordWrap
}
Text {
id: priceText
text: product.price
anchors.right: parent.right
anchors.rightMargin: topLevel.globalMargin
anchors.verticalCenter: parent.verticalCenter
}
MouseArea {
anchors.fill: parent
onClicked: {
pendingRect.visible = true;
spinBox.visible = true;
statusText.text = "Purchasing...";
storeItem.state = "PURCHASING";
product.purchase();
}
onPressed: {
storeItem.state = "PRESSED";
}
onReleased: {
storeItem.state = "NORMAL";
}
}
// ![0]
Rectangle {
id: pendingRect
anchors.fill: parent
opacity: 0.0
color: "white"
radius: parent.radius
Text {
id: statusText
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: spinBox.left
anchors.margins: topLevel.globalMargin
verticalAlignment: Text.AlignVCenter
}
BusyIndicator {
id: spinBox
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.right: parent.right
anchors.margins: topLevel.globalMargin
width: height
}
Connections {
target: product
function onPurchaseSucceeded() {
statusText.text = "Purchase Succeeded";
spinBox.visible = false;
}
function onPurchaseFailed() {
statusText.text = "Purchase Failed";
spinBox.visible = false;
storeItem.state = "NORMAL";
}
}
}
states: [
State {
name: "NORMAL"
PropertyChanges {
target: storeItem
color: "white"
border.color: "transparent"
}
PropertyChanges {
target: pendingRect
opacity: 0.0
}
},
State {
name: "PRESSED"
PropertyChanges {
target: storeItem
color: "transparent"
border.color: "white"
}
},
State {
name: "PURCHASING"
PropertyChanges {
target: pendingRect
opacity: 1.0
}
}
]
transitions: [
Transition {
from: "PURCHASING"
to: "NORMAL"
NumberAnimation { target: pendingRect; property: "opacity"; duration: 2000; easing.type: Easing.InExpo }
}
]
}
|
