diff --git a/data/qml/CoverFlip.qml b/data/qml/CoverFlip.qml index 565379df3..7f043aa7c 100644 --- a/data/qml/CoverFlip.qml +++ b/data/qml/CoverFlip.qml @@ -27,6 +27,7 @@ PathView { //highlightMoveDuration: 500 delegate: CoverImage { + id: coverDelegate height: root.coverSize width: root.coverSize backgroundColor: coverView.backgroundColor @@ -44,6 +45,10 @@ PathView { opacity: PathView.itemOpacity z: coverView.width - x + property int _origX + property int _origY + property int _origZ + onPlayClicked: { console.log("***************") coverView.itemPlayPauseClicked(index) @@ -52,6 +57,40 @@ PathView { onClicked: { coverView.itemClicked(index) } + + function newZ() { + return z; + } + + onContainsMouseChanged: { + if (containsMouse) { + _origX = x; + _origY = y; + _origZ = z; + } + } + + states: [ + State { + name: "hovered"; when: coverDelegate.containsMouse && index !== currentIndex + PropertyChanges { + target: coverDelegate + x: _origX + coverDelegate.width * coverDelegate.scale / 2 + z: _origZ + } + } + ] + transitions: [ + Transition { + NumberAnimation { + properties: "x" + duration: 300 + easing.type: Easing.InOutSine + } + + } + ] + } path: Path { diff --git a/data/qml/CoverImage.qml b/data/qml/CoverImage.qml index 6f255b5f1..b38d3e635 100644 --- a/data/qml/CoverImage.qml +++ b/data/qml/CoverImage.qml @@ -36,6 +36,8 @@ Item { signal playClicked() // will be emitted when the cover is clicked signal clicked() + // will be emitted when the cover is hovered by the mouse + property alias containsMouse: mouseArea.containsMouse MouseArea { id: mouseArea @@ -46,7 +48,6 @@ Item { print("Cover clicked"); root.clicked(); } - } Component {