70 lines
2.0 KiB
QML
70 lines
2.0 KiB
QML
import QtQuick 2.0
|
|
|
|
Item {
|
|
id: root
|
|
signal clicked()
|
|
signal back()
|
|
|
|
MouseArea {
|
|
id: ma
|
|
|
|
anchors.fill: parent
|
|
anchors.margins: -8
|
|
}
|
|
|
|
Rectangle {
|
|
id: bar1
|
|
x: 0
|
|
y: root.height / 6
|
|
width: root.height
|
|
height: root.height / 9
|
|
antialiasing: true
|
|
}
|
|
|
|
Rectangle {
|
|
id: bar2
|
|
x: 0
|
|
y: root.height / 2 - height / 2
|
|
width: root.height
|
|
height: root.height / 9
|
|
antialiasing: true
|
|
}
|
|
|
|
Rectangle {
|
|
id: bar3
|
|
x: 0
|
|
y: root.height / 2 + height * 2
|
|
width: root.height
|
|
height: root.height / 9
|
|
antialiasing: true
|
|
}
|
|
|
|
property int animationDuration: 450
|
|
|
|
state: "menu"
|
|
states: [
|
|
State {
|
|
name: "menu"
|
|
PropertyChanges { target: ma; onClicked: root.clicked() }
|
|
},
|
|
|
|
State {
|
|
name: "back"
|
|
PropertyChanges { target: root; rotation: 180 }
|
|
PropertyChanges { target: bar1; rotation: 45; width: root.height / 3 * 2; x: root.height / 2; y: root.height / 4 }
|
|
PropertyChanges { target: bar2; width: root.height / 6 * 5 + 1; x: root.height / 9 }
|
|
PropertyChanges { target: bar3; rotation: -45; width: root.height / 3 * 2; x: root.height / 2; y: root.height / 3 * 2 }
|
|
PropertyChanges { target: ma; onClicked: root.back() }
|
|
}
|
|
]
|
|
|
|
transitions: [
|
|
Transition {
|
|
RotationAnimation { target: root; direction: RotationAnimation.Clockwise; duration: animationDuration; easing.type: Easing.InOutQuad }
|
|
PropertyAnimation { target: bar1; properties: "rotation, width, x, y"; duration: animationDuration; easing.type: Easing.InOutQuad }
|
|
PropertyAnimation { target: bar2; properties: "rotation, width, x, y"; duration: animationDuration; easing.type: Easing.InOutQuad }
|
|
PropertyAnimation { target: bar3; properties: "rotation, width, x, y"; duration: animationDuration; easing.type: Easing.InOutQuad }
|
|
}
|
|
]
|
|
}
|