aboutsummaryrefslogtreecommitdiffstats
path: root/examples/quick/animation/basics
diff options
context:
space:
mode:
Diffstat (limited to 'examples/quick/animation/basics')
-rw-r--r--examples/quick/animation/basics/color-animation.qml121
-rw-r--r--examples/quick/animation/basics/images/face-smile.pngbin0 -> 15408 bytes
-rw-r--r--examples/quick/animation/basics/images/moon.pngbin0 -> 2433 bytes
-rw-r--r--examples/quick/animation/basics/images/shadow.pngbin0 -> 425 bytes
-rw-r--r--examples/quick/animation/basics/images/star.pngbin0 -> 349 bytes
-rw-r--r--examples/quick/animation/basics/images/sun.pngbin0 -> 8153 bytes
-rw-r--r--examples/quick/animation/basics/property-animation.qml105
7 files changed, 226 insertions, 0 deletions
diff --git a/examples/quick/animation/basics/color-animation.qml b/examples/quick/animation/basics/color-animation.qml
new file mode 100644
index 0000000000..f1bf40c40b
--- /dev/null
+++ b/examples/quick/animation/basics/color-animation.qml
@@ -0,0 +1,121 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+** the names of its contributors may be used to endorse or promote
+** products derived from this software without specific prior written
+** permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import QtQuick.Particles 2.0
+
+Item {
+ id: window
+ width: 320; height: 480
+
+ // Let's draw the sky...
+ Rectangle {
+ anchors { left: parent.left; top: parent.top; right: parent.right; bottom: parent.verticalCenter }
+ gradient: Gradient {
+ GradientStop {
+ position: 0.0
+ SequentialAnimation on color {
+ loops: Animation.Infinite
+ ColorAnimation { from: "DeepSkyBlue"; to: "#0E1533"; duration: 5000 }
+ ColorAnimation { from: "#0E1533"; to: "DeepSkyBlue"; duration: 5000 }
+ }
+ }
+ GradientStop {
+ position: 1.0
+ SequentialAnimation on color {
+ loops: Animation.Infinite
+ ColorAnimation { from: "SkyBlue"; to: "#437284"; duration: 5000 }
+ ColorAnimation { from: "#437284"; to: "SkyBlue"; duration: 5000 }
+ }
+ }
+ }
+ }
+
+ // the sun, moon, and stars
+ Item {
+ width: parent.width; height: 2 * parent.height
+ NumberAnimation on rotation { from: 0; to: 360; duration: 10000; loops: Animation.Infinite }
+ Image {
+ source: "images/sun.png"; y: 10; anchors.horizontalCenter: parent.horizontalCenter
+ rotation: -3 * parent.rotation
+ }
+ Image {
+ source: "images/moon.png"; y: parent.height - 74; anchors.horizontalCenter: parent.horizontalCenter
+ rotation: -parent.rotation
+ }
+ ParticleSystem {
+ id: particlesystem
+ x: 0; y: parent.height/2
+ width: parent.width; height: parent.height/2
+ ImageParticle {
+ source: "images/star.png"
+ groups: ["star"]
+ color: "#00333333"
+ SequentialAnimation on opacity {
+ loops: Animation.Infinite
+ NumberAnimation { from: 0; to: 1; duration: 5000 }
+ NumberAnimation { from: 1; to: 0; duration: 5000 }
+ }
+ }
+ Emitter {
+ group: "star"
+ anchors.fill: parent
+ emitRate: parent.width / 50
+ lifeSpan: 5000
+ }
+ }
+ }
+
+ // ...and the ground.
+ Rectangle {
+ anchors { left: parent.left; top: parent.verticalCenter; right: parent.right; bottom: parent.bottom }
+ gradient: Gradient {
+ GradientStop {
+ position: 0.0
+ SequentialAnimation on color {
+ loops: Animation.Infinite
+ ColorAnimation { from: "ForestGreen"; to: "#001600"; duration: 5000 }
+ ColorAnimation { from: "#001600"; to: "ForestGreen"; duration: 5000 }
+ }
+ }
+ GradientStop { position: 1.0; color: "DarkGreen" }
+ }
+ }
+}
diff --git a/examples/quick/animation/basics/images/face-smile.png b/examples/quick/animation/basics/images/face-smile.png
new file mode 100644
index 0000000000..3d66d72578
--- /dev/null
+++ b/examples/quick/animation/basics/images/face-smile.png
Binary files differ
diff --git a/examples/quick/animation/basics/images/moon.png b/examples/quick/animation/basics/images/moon.png
new file mode 100644
index 0000000000..9407b2b4f0
--- /dev/null
+++ b/examples/quick/animation/basics/images/moon.png
Binary files differ
diff --git a/examples/quick/animation/basics/images/shadow.png b/examples/quick/animation/basics/images/shadow.png
new file mode 100644
index 0000000000..8270565e87
--- /dev/null
+++ b/examples/quick/animation/basics/images/shadow.png
Binary files differ
diff --git a/examples/quick/animation/basics/images/star.png b/examples/quick/animation/basics/images/star.png
new file mode 100644
index 0000000000..27ef924267
--- /dev/null
+++ b/examples/quick/animation/basics/images/star.png
Binary files differ
diff --git a/examples/quick/animation/basics/images/sun.png b/examples/quick/animation/basics/images/sun.png
new file mode 100644
index 0000000000..7713ca5ce7
--- /dev/null
+++ b/examples/quick/animation/basics/images/sun.png
Binary files differ
diff --git a/examples/quick/animation/basics/property-animation.qml b/examples/quick/animation/basics/property-animation.qml
new file mode 100644
index 0000000000..4a4d3e3b2a
--- /dev/null
+++ b/examples/quick/animation/basics/property-animation.qml
@@ -0,0 +1,105 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+** the names of its contributors may be used to endorse or promote
+** products derived from this software without specific prior written
+** permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Item {
+ id: window
+ width: 320; height: 480
+
+ // Let's draw the sky...
+ Rectangle {
+ anchors { left: parent.left; top: parent.top; right: parent.right; bottom: parent.verticalCenter }
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "DeepSkyBlue" }
+ GradientStop { position: 1.0; color: "LightSkyBlue" }
+ }
+ }
+
+ // ...and the ground.
+ Rectangle {
+ anchors { left: parent.left; top: parent.verticalCenter; right: parent.right; bottom: parent.bottom }
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "ForestGreen" }
+ GradientStop { position: 1.0; color: "DarkGreen" }
+ }
+ }
+
+ // The shadow for the smiley face
+ Image {
+ anchors.horizontalCenter: parent.horizontalCenter
+ y: smiley.minHeight + 58
+ source: "images/shadow.png"
+
+ // The scale property depends on the y position of the smiley face.
+ scale: smiley.y * 0.5 / (smiley.minHeight - smiley.maxHeight)
+ }
+
+ Image {
+ id: smiley
+ property int maxHeight: window.height / 3
+ property int minHeight: 2 * window.height / 3
+
+ anchors.horizontalCenter: parent.horizontalCenter
+ y: minHeight
+ source: "images/face-smile.png"
+
+ // Animate the y property. Setting loops to Animation.Infinite makes the
+ // animation repeat indefinitely, otherwise it would only run once.
+ SequentialAnimation on y {
+ loops: Animation.Infinite
+
+ // Move from minHeight to maxHeight in 300ms, using the OutExpo easing function
+ NumberAnimation {
+ from: smiley.minHeight; to: smiley.maxHeight
+ easing.type: Easing.OutExpo; duration: 300
+ }
+
+ // Then move back to minHeight in 1 second, using the OutBounce easing function
+ NumberAnimation {
+ from: smiley.maxHeight; to: smiley.minHeight
+ easing.type: Easing.OutBounce; duration: 1000
+ }
+
+ // Then pause for 500ms
+ PauseAnimation { duration: 500 }
+ }
+ }
+}