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
|
// Copyright (C) 2019 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only
import QtQuick 2.9
Item {
id: root
width: 600
height: 65
property alias progress: timeline.currentFrame
Rectangle {
id: pb_back
color: "#9f9f9f"
radius: 4
anchors.right: parent.right
anchors.rightMargin: 0
anchors.left: parent.left
anchors.leftMargin: 0
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
anchors.top: parent.top
anchors.topMargin: 30
Rectangle {
id: pb_front
width: 200
color: "#ffffff"
anchors.bottomMargin: 5
anchors.left: parent.left
anchors.leftMargin: 5
anchors.bottom: parent.bottom
anchors.top: parent.top
anchors.topMargin: 5
}
}
Text {
id: text1
color: "#ffffff"
text: Math.round(root.progress)
font.pixelSize: 18
}
Timeline {
id: timeline
enabled: true
startFrame: 0
endFrame: 100
KeyframeGroup {
target: text1
property: "color"
Keyframe {
value: "#8de98d"
frame: 0
}
Keyframe {
value: "#de4f4f"
frame: 50
}
Keyframe {
value: "#f0c861"
frame: 100
}
}
KeyframeGroup {
target: pb_front
property: "width"
Keyframe {
value: 0
frame: 0
}
Keyframe {
value: 590
frame: 100
}
}
KeyframeGroup {
target: pb_front
property: "color"
Keyframe {
value: "#8de98d"
frame: 0
}
Keyframe {
value: "#de4f4f"
frame: 50
}
Keyframe {
value: "#f0c861"
frame: 100
}
}
}
}
|
