Change 'to' value of NumberAnimation dynamically with another NumberAnimation ?



  • Hello! I'm trying to achieve dynamically setting the property 'to' of an NumberAnimation to a value read from a property, like this:

                Translate {
                    id: poly_trans
                    x: 0.0
                    y: 0.0
    
                    property real y_target: 1
    
                    SequentialAnimation on y {
                        NumberAnimation {
                            id: num0
                            to: poly_trans.y_target
                            duration: 300
                            easing.type: Easing.bezierCurve
                        }
                        NumberAnimation {
                            to: -poly_trans.y_target
                            duration: 300
                            easing.type: Easing.bezierCurve
                        }
                        loops: Animation.Infinite
                        running: true
                    }
    
                    NumberAnimation on y_target {
                        to: 20
                        duration: 5000
                    }
    

    Basically what I'm trying to achieve is to animate between -y_target and y_target, so that the y_target is oscillating. But seems the value is not updated. Any idea how I could implement this kind of dynamic updating of the NumberAnimation properties ?

    Thanks!


  • Moderators

    @ind1g1ne0us said in Change 'to' value of NumberAnimation dynamically with another NumberAnimation ?:

    loops: Animation.Infinite

    Hi! The values won't get updated when you use loops: Animation.Infinite. You could i.e. remove that and instead use onStopped: start().



  • @Wieland Thank you, that works. Makes sense.


  • Moderators

    Another possible solution would be to generate numbers in a fixed range (-1..1) and multiply the result with a variable value.

    Oscillator.qml

    import QtQuick 2.7
    
    Item {
        id: oscillator
    
        readonly property alias value: oscillator._f
    
        // private
    
        property real _t: 0
        property real _f: Math.sin(_t)
    
        NumberAnimation on _t {
            from: 0
            to: 2 * Math.PI
            duration: 1000
    
            running: true
            loops: Animation.Infinite
        }
    
    }
    

    main.qml

    import QtQuick 2.7
    import QtQuick.Controls 2.0
    import QtQuick.Layouts 1.3
    
    ApplicationWindow {
        id: main
        visible: true
        width: 640
        height: 480
        color: "black"
    
        Slider { // modulation
            id: slider
            from: 0
            value: 0
            to: 200
            live: true
        }
    
        Oscillator {
            id: sineGenerator
        }
    
        Rectangle {
            id: rect
            width: 15
            height: 15
            color: "#0f0"
    
            readonly property real x_offset: 200
            readonly property real y_offset: 100
    
            x: sineGenerator.value * slider.value + x_offset
            y: y_offset
        }
    
    }
    

Log in to reply
 

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