Animation



  • Hi,

    Please read this note from this page:
    Now you can play around with the animation by changing the to and duration property or you could add another animation for example on the opacity or even the scale. Combining these it could look like the object is disappearing in the deep space. Try it out!

    I used OpacityAnimator and ScaleAnimator as below, using the Help button of Qt Creator. Is it what it asked, please?

    animation.qml:

    import QtQuick 2.6
    import QtQuick.Window 2.2
    import QtQuick.Controls 2.2
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Animation")
    
        Image {
            id: root
            source: "assets/background.png"
    
            property int padding: 40
            property int duration: 700
            property bool running: false
    
            Image {
                id: box
                x: root.padding
                y: (root.height-height)/2
                source: "assets/box_green.png"
            }
    
           NumberAnimation on x {
                    to: root.width
                    duration: root.duration
                    running: root.running
                }
    
           RotationAnimation on rotation {
                    to: 360
                    duration: root.duration
                    running: root.running
                }
    
           OpacityAnimator {
               target: root;
               from: 0;
               to: 1;
               duration: root.duration
               running: root.running
           }
    
           ScaleAnimator {
               target: root;
               from: 0.25;
               to: 1;
               duration: root.duration
               running: root.running
           }
         }
    
            MouseArea {
                anchors.fill: root
                onClicked: root.running = true
            }
    
        Button {
            id: quit
            x: 20; y: 400
            text: qsTr("Quit")
            onClicked: close()
        }
    }
    


  • @tomy If I would want to fullfill the purpose of the "exercise" as stated I would rather do

    OpacityAnimator {
               target: root;
               from: 1;
               to: 0;
               etc...
           }
    
           ScaleAnimator {
               target: root;
               from: 1;
               to: 0.1;
               etc...
          }
    

    Now it's "disappearing in" rather than "appering from".


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.