dorian/fanny-app
dorian/fanny-app
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity

added animation to error field

Browse source
This commit is contained in:
Dorian Zedler 2018-07-15 22:03:10 +02:00
parent c1e0f29979
commit 836afb0a30
1 changed files with 49 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
qml/AppToolBar.qml
View file

@ -3,18 +3,40 @@ import QtQuick.Controls 2.1
import QtQuick.Controls.Material 2.1
ToolBar {
id: toolBar
property bool showErrorBar: true
Material.theme: Material.Light
Rectangle {
id: errorField
width: parent.width
height: 30
visible: window.is_error & stackView.currentItem.objectName !== "LoginPage" & showErrorBar
enabled: window.is_error & stackView.currentItem.objectName !== "LoginPage" & showErrorBar
anchors.top: parent.bottom
color: "red"
onEnabledChanged: {
if(enabled){
toolBar.state = 'moveIn'
}
else {
toolBar.state = 'moveOut'
}
}
MouseArea { anchors.fill: parent; onClicked: {
toolBar.state = 'moveOut'
console.log("clicked")
}
}
Text {
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
anchors {
top: parent.top
horizontalCenter: parent.horizontalCenter
topMargin: ( parent.height / 2 ) - ( height / 2 )
}
id: errorText
font.family: "Helvetica"
color: "White"
@ -23,4 +45,28 @@ ToolBar {
text: window.error
}
}
states: [
State {
name: "moveOut"
PropertyChanges { target: errorField; height: 0 }
PropertyChanges { target: errorText; height: 0 }
},
State {
name: "moveIn"
PropertyChanges { target: errorField; height: 30 }
PropertyChanges { target: errorText; height: 0 }
}
]
transitions: [
Transition {
to: "moveOut"
NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
},
Transition {
to: "moveIn"
NumberAnimation { properties: "height"; easing.type: Easing.InOutQuad; duration: 200 }
}
]
}