<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Animation]]></title><description><![CDATA[<p dir="auto">Hi,</p>
<p dir="auto">Please read this note from <a href="https://qmlbook.github.io/en/ch05/index.html#animation-elements" target="_blank" rel="noopener noreferrer nofollow ugc">this page</a>:<br />
<em>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!</em></p>
<p dir="auto">I used <em>OpacityAnimator</em> and <em>ScaleAnimator</em> as below, using the Help button of Qt Creator. Is it what it asked, please?</p>
<p dir="auto"><strong>animation.qml</strong>:</p>
<pre><code>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()
    }
}
</code></pre>
]]></description><link>https://forum.qt.io/topic/84391/animation</link><generator>RSS for Node</generator><lastBuildDate>Wed, 23 Sep 2026 16:27:39 GMT</lastBuildDate><atom:link href="https://forum.qt.io/topic/84391.rss" rel="self" type="application/rss+xml"/><pubDate>Mon, 23 Oct 2017 08:35:23 GMT</pubDate><ttl>60</ttl><item><title><![CDATA[Reply to Animation on Mon, 23 Oct 2017 19:12:37 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/tomy">@<bdi>tomy</bdi></a> If I would want to fullfill the purpose of the "exercise" as stated I would rather do</p>
<pre><code>OpacityAnimator {
           target: root;
           from: 1;
           to: 0;
           etc...
       }

       ScaleAnimator {
           target: root;
           from: 1;
           to: 0.1;
           etc...
      }
</code></pre>
<p dir="auto">Now it's "disappearing in" rather than "appering from".</p>
]]></description><link>https://forum.qt.io/post/422325</link><guid isPermaLink="true">https://forum.qt.io/post/422325</guid><dc:creator><![CDATA[Eeli K]]></dc:creator><pubDate>Mon, 23 Oct 2017 19:12:37 GMT</pubDate></item></channel></rss>