1
0
mirror of https://gitlab.com/kelteseth/ScreenPlay.git synced 2024-09-15 06:52:34 +02:00

Add out animations

This commit is contained in:
Elias 2018-12-16 17:30:33 +01:00
parent b825e7108b
commit a0afbb6085
3 changed files with 114 additions and 21 deletions

View File

@ -10,8 +10,9 @@ Item {
id: create
anchors.fill: parent
state: "out"
Component.onCompleted: {
create.state = "create"
create.state = "in"
}
property url activeVideoFile: ""
property url activeFolder: ""
@ -41,7 +42,7 @@ Item {
target: loader.item
ignoreUnknownSignals: true
onBackToCreate: {
create.state = "create"
create.state = "in"
loader.active = false
activeVideoFile = ""
}
@ -278,7 +279,7 @@ Item {
}
},
State {
name: "create"
name: "in"
PropertyChanges {
target: spaceBar
opacity: .4
@ -307,10 +308,18 @@ Item {
target: txtDescriptionBottom
opacity: 0
}
PropertyChanges {
target: footer
anchors.bottomMargin: -80
}
},
State {
name: "new"
PropertyChanges {
target: footer
anchors.bottomMargin: -80
}
PropertyChanges {
target: createWallpaper
state: "out"
@ -332,11 +341,11 @@ Item {
transitions: [
Transition {
from: "out"
to: "create"
to: "in"
reversible: true
NumberAnimation {
target: txtDescriptionBottom
targets: [txtDescriptionBottom, footer]
property: "opacity"
duration: 400
easing.type: Easing.InOutQuart
@ -355,6 +364,18 @@ Item {
}
}
NumberAnimation {
target: footer
property: "anchors.bottomMargin"
duration: 400
easing.type: Easing.InOutQuart
}
},
Transition {
from: "in"
to: "new"
reversible: true
NumberAnimation {
target: footer
property: "anchors.bottomMargin"
@ -364,3 +385,9 @@ Item {
}
]
}
/*##^## Designer {
D{i:0;autoSize:true;height:768;width:1366}
}
##^##*/

View File

@ -3,7 +3,9 @@ import QtGraphicalEffects 1.0
import Qt.labs.platform 1.0
Item {
id:createWidget
state: "out"
Component.onCompleted: state = "in"
signal buttonPressed(var type, var title, var iconSource)
@ -29,6 +31,7 @@ Item {
anchors.top: txtCreate.bottom
anchors.topMargin: 10
animOffset: 50
state: createWidget.state
imgSource: "qrc:/assets/icons/icon_emptyWidget.svg"
onClicked: {
@ -72,6 +75,7 @@ Item {
text: qsTr("Simple clock widget")
buttonActive: true
animOffset: 150
state: createWidget.state
imgSource: "qrc:/assets/icons/icon_time.svg"
onClicked: {
buttonPressed("clock", btnEmpty1.text, btnEmpty1.imgSource)
@ -82,6 +86,7 @@ Item {
text: qsTr("Musik scene wallpaper visualizer")
buttonActive: true
animOffset: 200
state: createWidget.state
imgSource: "qrc:/assets/icons/icon_library_music.svg"
onClicked: {
buttonPressed("music", btnEmpty2.text, btnEmpty2.imgSource)
@ -93,6 +98,7 @@ Item {
imgSource: "qrc:/assets/icons/icon_scene.svg"
buttonActive: true
animOffset: 250
state: createWidget.state
onClicked: {
buttonPressed("slideshow", btnEmpty3.text, btnEmpty3.imgSource)
}
@ -113,6 +119,26 @@ Item {
opacity: 0
anchors.topMargin: -50
}
PropertyChanges {
target: btnEmpty1
opacity: 0
}
PropertyChanges {
target: btnEmpty2
opacity: 0
}
PropertyChanges {
target: btnEmpty3
opacity: 0
}
PropertyChanges {
target: btnCreateEmptyWidget
opacity: 0
}
},
State {
name: "in"
@ -136,26 +162,24 @@ Item {
to: "in"
reversible: true
ParallelAnimation {
PropertyAnimation {
target: txtCreate
properties: "opacity,anchors.topMargin"
duration: 400
easing.type: Easing.InOutQuart
}
SequentialAnimation {
PauseAnimation {
duration: 50
}
PropertyAnimation {
target: txtCreate
target: txtExamples
properties: "opacity,anchors.topMargin"
duration: 400
easing.type: Easing.InOutQuart
}
SequentialAnimation {
PauseAnimation {
duration: 50
}
PropertyAnimation {
target: txtExamples
properties: "opacity,anchors.topMargin"
duration: 400
easing.type: Easing.InOutQuart
}
}
}
}
]
@ -164,6 +188,10 @@ Item {
/*##^## Designer {
D{i:0;autoSize:true;height:480;width:640}
}

View File

@ -135,7 +135,45 @@ Item {
Transition {
from: "out"
to: "in"
reversible: true
SequentialAnimation {
PauseAnimation {
duration: btnEmpty.animOffset
}
ParallelAnimation {
ParallelAnimation {
NumberAnimation {
target: bg
property: "opacity"
duration: 400
easing.type: Easing.InOutQuart
}
NumberAnimation {
target: bg
property: "anchors.topMargin"
easing.type: Easing.InOutQuart
duration: 400
}
}
SequentialAnimation {
PauseAnimation {
duration: 200
}
NumberAnimation {
target: effect
property: "opacity"
duration: 400
easing.type: Easing.InOutQuart
}
}
}
}
},
Transition {
from: "in"
to: "out"
SequentialAnimation {
PauseAnimation {