Component Showcase Demo App
import QtQuick 2.0
MouseArea {
property alias hintColor: hintRect.color
property bool hintEnabled: true
Rectangle {
id: hintRect
anchors.fill: parent
color: "yellow"
opacity: 0
states: [
State {
name: "high"
PropertyChanges {
target: hintRect
opacity: 0.8
}
},
State {
name: "low"
PropertyChanges {
target: hintRect
opacity: 0.4
}
}
]
transitions: [
Transition {
from: "low"
to: "high"
SequentialAnimation {
NumberAnimation {
properties: "opacity"
easing.type: Easing.InOutSine
duration: 500
}
ScriptAction { script: hintRect.state = "low" }
}
},
Transition {
from: "*"
to: "low"
SequentialAnimation {
NumberAnimation {
properties: "opacity"
easing.type: Easing.InOutSine
duration: 500
}
ScriptAction { script: hintRect.state = "high" }
}
},
Transition {
from: "*"
to: "baseState"
NumberAnimation {
properties: "opacity"
easing.type: Easing.InOutSine
duration: 500
}
}
]
}
onHintEnabledChanged: hintRect.state = hintEnabled ? "low" : "baseState"