Stackview replace qml after button animation is completed - qt

Question

i am building an interface with QtQuick2 by using qmls. I also created a few buttons on home page and i am trying to change qmls by using loader after some animation is played. I have a stackview like this:
StackView {
id: stackViewTool
anchors {
left: parent.left
right: parent.right
top: parent.top
bottom: bottomBar.top
}
initialItem: initializePage
}
and i also added "initializePage" variable as property
property string initializePage : "HomePage.qml"
here is how i use my button to change qml on some other pages.
SimpleButton {
id:homeClicked
Image{
id: homeID
source:"/images/barHome.png"
}
onClicked: {
stackViewTool.replace(initializePage)
}
}
I want to add a animation to get the "pushing button" feeling. I want to change the button image first, and then i want to replace the qml. Here is the sequental animation i want to use. I want to have the animation like pushed and released, then change the qml.
SequentialAnimation {
id : homePressed
PropertyAnimation {
targets: [homeID]
property: "source"
to: "/images/pressedHome.png"
}
PauseAnimation {
duration: 100
}
PropertyAnimation {
targets: [homeID]
property: "source"
to: "/images/barHome.png"
}
PauseAnimation {
duration: 100
}
}
I tried to use "stackViewTool.replace(initializePage)" after the sequential animation but it did not work. I tried to add "Component.onCompleted: stackViewTool.replace(initializePage)" after 100ms pause snippet(last step of animation) but it did not work. What can i do for create something like i wanted? Answers are appreciated.

Answer 1

You can use the onFinished | onStarted signal handlers.
You can use ScriptAction at the end of the animation:
SequentialAnimation
{
id: homePressed
PropertyAnimation {
targets: [homeID]
property: "source"
to: "/images/pressedHome.png"
}
PauseAnimation {
duration: 100
}
PropertyAnimation {
targets: [homeID]
property: "source"
to: "/images/barHome.png"
}
PauseAnimation {
duration: 100
}
ScriptAction{
script: function(){stackViewTool.replace(initializePage)}
}
}