126 lines
3.0 KiB
QML
126 lines
3.0 KiB
QML
/*
|
|
SPDX-FileCopyrightText: 2010 Davide Bettio <davide.bettio@kdemail.net>
|
|
|
|
SPDX-License-Identifier: GPL-2.0-or-later
|
|
*/
|
|
|
|
import QtQuick 1.0
|
|
|
|
Flipable {
|
|
id: card;
|
|
property string cardPicture: "card.svgz";
|
|
property bool showPicture: false;
|
|
property bool matched: false;
|
|
state: "normal"
|
|
width: cardBack.width
|
|
height: cardBack.height
|
|
|
|
Behavior on opacity {
|
|
NumberAnimation {
|
|
target: card
|
|
property: "opacity"
|
|
duration: 300
|
|
}
|
|
}
|
|
|
|
front: Image {
|
|
id: cardBack
|
|
anchors.centerIn: parent
|
|
source: "card.svgz";
|
|
}
|
|
back: Image {
|
|
anchors.centerIn: parent
|
|
source: cardPicture;
|
|
}
|
|
|
|
transform: Rotation {
|
|
id: rotation
|
|
origin.x: card.width/2
|
|
origin.y: card.height/2
|
|
axis.x: 0; axis.y: 1; axis.z: 0
|
|
angle: 0
|
|
Behavior on angle {
|
|
NumberAnimation {
|
|
target: rotation
|
|
property: "angle"
|
|
duration: 300
|
|
}
|
|
}
|
|
}
|
|
|
|
SequentialAnimation {
|
|
id: checkAnimation
|
|
NumberAnimation {
|
|
target: rotation
|
|
property: "angle"
|
|
duration: 300
|
|
from: 0
|
|
to: 180
|
|
}
|
|
PauseAnimation {
|
|
duration: 300
|
|
}
|
|
NumberAnimation {
|
|
target: rotation
|
|
property: "angle"
|
|
duration: 300
|
|
from: 180
|
|
to: 0
|
|
}
|
|
}
|
|
|
|
MouseArea {
|
|
id: mouseArea;
|
|
anchors.fill: parent;
|
|
onClicked: {
|
|
if (!pairsCanvas.currentCard){
|
|
pairsCanvas.currentCard = card;
|
|
card.state = "checking"
|
|
} else if (pairsCanvas.currentCard != card) {
|
|
if (pairsCanvas.currentCard.cardPicture == card.cardPicture){
|
|
card.state = pairsCanvas.currentCard.state = "matched"
|
|
pairsCanvas.matchesCountdown--;
|
|
} else {
|
|
card.state = pairsCanvas.currentCard.state = "normal"
|
|
checkAnimation.running = true
|
|
}
|
|
pairsCanvas.currentCard = null;
|
|
}
|
|
}
|
|
}
|
|
|
|
states: [
|
|
State {
|
|
name: "normal";
|
|
PropertyChanges {
|
|
target: card;
|
|
showPicture: false
|
|
}
|
|
PropertyChanges {
|
|
target: rotation;
|
|
angle: 0
|
|
}
|
|
},
|
|
State {
|
|
name: "checking";
|
|
PropertyChanges {
|
|
target: rotation;
|
|
angle: 180
|
|
}
|
|
},
|
|
State {
|
|
name: "matched";
|
|
PropertyChanges {
|
|
target: card;
|
|
opacity: 0.3
|
|
enabled: false
|
|
showPicture: true
|
|
}
|
|
PropertyChanges {
|
|
target: rotation;
|
|
angle: 180
|
|
}
|
|
}
|
|
]
|
|
}
|