blob: 9aa933efa63b71741b0fb56070c2ea93a58cce0f (
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
|
// Copyright (C) 2016 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0
import QtQuick 2.0
Item {
id: root
width: 800
height: 100
Rectangle {
gradient: Gradient {
GradientStop {
position: 0
color: "#aaa7a7"
}
GradientStop {
position: 0.340
color: "#a4a4a4"
}
GradientStop {
position: 1
color: "#6b6b6b"
}
}
anchors.fill: parent
}
Button {
id: button
x: 19
y: 20
width: 133
height: 61
onClicked: {
if (root.state ==="")
root.state = "moved";
else
root.state = "";
}
}
Rectangle {
id: groove
x: 163
y: 20
width: 622
height: 61
color: "#919191"
radius: 4
border.color: "#adadad"
Rectangle {
id: rectangle
x: 9
y: 9
width: 46
height: 46
color: "#3045b7"
radius: 4
border.width: 2
smooth: true
border.color: "#9ea0bb"
anchors.bottomMargin: 6
anchors.topMargin: 9
anchors.top: parent.top
anchors.bottom: parent.bottom
}
}
states: [
State {
name: "moved"
PropertyChanges {
rectangle {
x: 567
y: 9
anchors.bottomMargin: 6
anchors.topMargin: 9
}
}
}
]
transitions: [
Transition {
from: ""
to: "moved"
SequentialAnimation {
PropertyAnimation {
easing: editor.easingCurve
property: "x"
duration: spinBox.value
}
}
},
Transition {
from: "moved"
to: ""
PropertyAnimation {
easing: editor.easingCurve
property: "x"
duration: spinBox.value
}
}
]
}
|