pier_nasos
pier_nasos

Reputation: 678

Temporarily disable (ignore / not display) the animation on a complex QML component

Is it possible to temporarily disable (ignore / not display) the animation on a complex QML component until a certain point in time? And later activate the animation and work as usual.

For example. A complex page on QML displays the data of the object, there are many small animations. When changing a data object, these animations should be ignored.

Rectangle {
    anchors.fill: parent
        property variant cppViewModel: MyCppViewModel {
            onBeforDataObjectChanged: {

            }
            onAfterDataObjectChanged: {

            }
        }

    Rectangle {
        id: idRect1
        Behavior on x { NumberAnimation { ... }}
        Behavior on y { NumberAnimation { ... }}
        x: cppViewModel.dataObject.offsetX
        y: cppViewModel.dataObject.offsetY
        scale: cppViewModel.dataObject.scale

        Rectangle {
            id: idRect2

            width: cppViewModel.dataObject.width
            heigth: cppViewModel.dataObject.heigth
            Behavior on width { NumberAnimation { ... }}
            Behavior on heigth { NumberAnimation { ... }}

            ColumnLayout {
                Rectangle {
                    Layout.preferredHeight: 100 * cppViewModel.dataObject.width1
                    Behavior on Layout.preferredHeight { NumberAnimation { duration: 500; easing.type: Easing.OutQuad; }}
                    //... Any number of children with animation
                }
            }
        }
    }

    PropertyAnimation { target: idRect1; property: "scale"; from: 0.9; to: 1.0; ... }
}

If the values of the properties of the current data object change, then animation is needed. If the entire object changes to another, then the animation needs to be blocked.

Upvotes: 2

Views: 3383

Answers (1)

derM
derM

Reputation: 13691

To disable Animations, there are various ways, and the right one depends on how the Animation is started.

  • If the Animation is started by setting the running-property, you can simply add a && animationsEnabled to the condition where animationsEnabled is a property, you have to define somewhere else and toggle it accordingly.

  • If you use the function: run() to start your Animation, the solution is to not do it.

  • If you use the Animation within a Behavior, you can use the Behaviors enabled-property to deactivate the Behavior and its Animation.

  • Finally, I can think of Transitions. Just as Behavior, Transition has an enabled-property, to deactivate it.

I hope I have not forgotten a way to animate and you will find the appropriate solution for your problem!

Upvotes: 3

Related Questions