Solution for Animating multiple QML files from a separate qml file.
-
Hello,
I have a project with following structure.
The ViewAnimation.qml has a Timeline animation with key frames, which animates all SubView and their childs in MainView. When the show button pressed this animation play in forward and when hide button pressed animation play in reverse direction.
How we can access the subview and their child in ViewAnimation.qml?
Solutions already tried:
- Using Singleton qml and store the subview objects in it as property
pragma Singleton import QtQuick 2.15 QtObject { property var subView1 property var subView2 property var subView3 }
Rectangle { id: mainView onStateChanged: { console.log("state changes to: ", state) } Component.onCompleted: { ObjectFactory.subView1= m_sub1 ObjectFactory.subView2= m_sub2 ObjectFactory.subView3= m_sub3 } width: 700 height: 150 color: "#82E0AA" border.width: 2 border.color: "black" SubView1{id: m_sub1; x: 75; y: 25} SubView2{id: m_sub2;x: 250; y: 25} SubView3{id: m_sub3;x: 425; y: 25} }
and accessing then in ViewAnimation.qml like:
keyframeGroups: [ KeyframeGroup { property: "x"; target: ObjectFactory.subView1 Keyframe { frame: 0; value: 75 } Keyframe { frame: 50; value: 75 } Keyframe { frame: 100; value: 25 } }, KeyframeGroup { property: "opacity"; target: ObjectFactory.subView2 Keyframe { frame: 0; value: 0 } Keyframe { frame: 50; value: 0.5 } Keyframe { frame: 100; value: 1 } }, KeyframeGroup { property: "x"; target: ObjectFactory.subView3 Keyframe { frame: 0; value: 425 } Keyframe { frame: 50; value: 425 } Keyframe { frame: 100; value: 475 } }, KeyframeGroup { property: "scale"; target: ObjectFactory.subView2.children[0] Keyframe { frame: 0; value: 0 } Keyframe { frame: 50; value: 0.5 } Keyframe { frame: 100; value: 1 } }, KeyframeGroup { property: "scale"; target: ObjectFactory.subView2.children[1] Keyframe { frame: 0; value: 0 } Keyframe { frame: 50; value: 0.5 } Keyframe { frame: 100; value: 1 } } ]
- Instead of Singleton QML create properties inside MainView.qml itself to hold the references of SubViews and access same way as method1.
Both solutions work for now, but as the projects grows there can be many views their subviews and their child need to animated same way. Accessing them in animation using above method cannot be easy approach.
Is there a better solution other than these two methods, so that accessing and animating them will be easy without of much of manual efforts?