aboutsummaryrefslogtreecommitdiffstats
path: root/tests/testapplications
diff options
context:
space:
mode:
authorDamian Jansen <damian.jansen@nokia.com>2012-03-21 11:26:34 +1000
committerQt by Nokia <qt-info@nokia.com>2012-03-21 08:04:33 +0100
commitdd952a25aacaba163df22cd35da299c3719f5d73 (patch)
tree457b8c9b37ce608470e617dab03b127565edd671 /tests/testapplications
parent669cbe4e5410deee4411cac414963515dc99692d (diff)
ListView system tests
Tests: Change of model, delegate and orientation at runtime Use of add, move and remove view transitions Changing of view transitions at runtime Task-number: QTBUG-21504 Change-Id: Icaeb5c0305c7db5db4c4b8c5ad5fd1d6393cc599 Reviewed-by: Bea Lam <bea.lam@nokia.com>
Diffstat (limited to 'tests/testapplications')
-rw-r--r--tests/testapplications/listview/alteredViews.qml153
-rw-r--r--tests/testapplications/listview/onRemove.qml156
-rw-r--r--tests/testapplications/listview/star.pngbin0 -> 1550 bytes
-rw-r--r--tests/testapplications/listview/viewTransitions.qml479
4 files changed, 788 insertions, 0 deletions
diff --git a/tests/testapplications/listview/alteredViews.qml b/tests/testapplications/listview/alteredViews.qml
new file mode 100644
index 0000000000..26aa678db2
--- /dev/null
+++ b/tests/testapplications/listview/alteredViews.qml
@@ -0,0 +1,153 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the test suite 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
+
+Rectangle {
+ width: 300
+ height: 400
+
+ ListView {
+ id: listview
+ model: model1
+ delegate: delegate1
+ anchors.fill: parent
+ anchors.margins: 20
+ }
+
+ Component {
+ id: delegate1
+ Rectangle {
+ height: listview.orientation == ListView.Horizontal ? 260 : 50
+ Behavior on height { NumberAnimation { duration: 500 } }
+ width: listview.orientation == ListView.Horizontal ? 50 : 260
+ Behavior on width { NumberAnimation { duration: 500 } }
+ border.color: "black"
+ Text {
+ anchors.centerIn: parent; color: "black"; text: model.name
+ rotation: listview.orientation == ListView.Horizontal ? -90 : 0
+ Behavior on rotation { NumberAnimation { duration: 500 } }
+
+ }
+ }
+ }
+
+ Component {
+ id: delegate2
+ Rectangle {
+ height: listview.orientation == ListView.Horizontal ? 260 : 50
+ Behavior on height { NumberAnimation { duration: 500 } }
+ width: listview.orientation == ListView.Horizontal ? 50 : 260
+ Behavior on width { NumberAnimation { duration: 500 } }
+ color: "goldenrod"; border.color: "black"
+ Text {
+ anchors.centerIn: parent; color: "royalblue"; text: model.name
+ rotation: listview.orientation == ListView.Horizontal ? -90 : 0
+ Behavior on rotation { NumberAnimation { duration: 1500 } }
+ }
+ }
+
+ }
+
+ Column {
+ Rectangle {
+ height: 50
+ width: 50
+ color: "blue"
+ border.color: "orange"
+ Text {
+ anchors.centerIn: parent
+ text: "Mod"
+ }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.model = listview.model == model2 ? model1 : model2
+ }
+ }
+
+ Rectangle {
+ height: 50
+ width: 50
+ color: "blue"
+ border.color: "orange"
+ Text {
+ anchors.centerIn: parent
+ text: "Del"
+ }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.delegate = listview.delegate == delegate2 ? delegate1 : delegate2
+ }
+ }
+
+ Rectangle {
+ height: 50
+ width: 50
+ color: "blue"
+ border.color: "orange"
+ Text {
+ anchors.centerIn: parent
+ text: "Ori"
+ }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.orientation = listview.orientation == ListView.Horizontal ? ListView.Vertical : ListView.Horizontal
+ }
+ }
+ }
+
+ ListModel {
+ id: model1
+ ListElement { name: "model1_1" }
+ ListElement { name: "model1_2" }
+ ListElement { name: "model1_3" }
+ ListElement { name: "model1_4" }
+ ListElement { name: "model1_5" }
+ }
+
+ ListModel {
+ id: model2
+ ListElement { name: "model2_1" }
+ ListElement { name: "model2_2" }
+ ListElement { name: "model2_3" }
+ ListElement { name: "model2_4" }
+ ListElement { name: "model2_5" }
+ }
+}
diff --git a/tests/testapplications/listview/onRemove.qml b/tests/testapplications/listview/onRemove.qml
new file mode 100644
index 0000000000..2c1d52a40e
--- /dev/null
+++ b/tests/testapplications/listview/onRemove.qml
@@ -0,0 +1,156 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the test suite 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: root
+ width: 450; height: 600
+
+ Component {
+ id: viewDelegate
+
+ Rectangle {
+ id: item
+ signal boom
+ Connections {
+ target: item
+ onBoom: emitter.burst(1000)
+ }
+
+ width: 225; height: 40
+ border.width: ListView.isCurrentItem ? 3 : 1
+ z: ListView.isCurrentItem ? 100 : 1
+ color: original ? "lightsteelblue" : "yellow"
+ objectName: name
+ Text { x: 10; text: name; font.pixelSize: 20 }
+ MouseArea { anchors.fill: parent; onClicked: listview.currentIndex = index }
+
+ Emitter {
+ id: emitter
+ system: ps
+ anchors.fill: parent
+ enabled: false
+ speed: AngleDirection {
+ angle: 0
+ angleVariation: 360
+ magnitude: 50
+ magnitudeVariation: 50
+ }
+ lifeSpan: 2000
+ }
+
+ ListView.onRemove: SequentialAnimation {
+ PropertyAction { target: item; property: "ListView.delayRemove"; value: true }
+ PropertyAction { target: item; property: "opacity"; value: 0 }
+ ScriptAction { script: item.boom() }
+ PauseAnimation { duration: 1000 }
+ PropertyAction { target: item; property: "ListView.delayRemove"; value: false }
+ }
+ }
+ }
+
+
+ ListView {
+ id: listview
+ width: 225; height: 500
+ anchors.centerIn: parent
+ delegate: viewDelegate
+ header: Rectangle {
+ height: 50; width: 225
+ color: "blue"
+ Text { anchors.centerIn: parent; text: "Transitions!"; color: "goldenrod" }
+ }
+ model: ListModel {
+ id: a_model
+ ListElement { name: "Item A"; original: true }
+ ListElement { name: "Item B"; original: true }
+ ListElement { name: "Item C"; original: true }
+ ListElement { name: "Item D"; original: true }
+ ListElement { name: "Item E"; original: true }
+ ListElement { name: "Item F"; original: true }
+ }
+ Rectangle {
+ anchors.fill: parent
+ color: "transparent"
+ border.color: "black"
+ }
+
+ }
+
+ ParticleSystem {
+ id: ps
+ ImageParticle {
+ id: imageparticle
+ source: "star.png"
+ color: "blue"
+ }
+ }
+ Column {
+ spacing: 2
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "+"; font.pixelSize: 25; font.bold: true }
+ MouseArea { anchors.fill: parent; onClicked: listview.model.insert(listview.currentIndex+1, {"name": "New item", "original": false } ) }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "-"; font.pixelSize: 25; font.bold: true }
+ MouseArea { anchors.fill: parent; onClicked: listview.model.remove(listview.currentIndex) }
+ }
+ }
+}
+
+
+
diff --git a/tests/testapplications/listview/star.png b/tests/testapplications/listview/star.png
new file mode 100644
index 0000000000..0d592cfa87
--- /dev/null
+++ b/tests/testapplications/listview/star.png
Binary files differ
diff --git a/tests/testapplications/listview/viewTransitions.qml b/tests/testapplications/listview/viewTransitions.qml
new file mode 100644
index 0000000000..6ed7cc1619
--- /dev/null
+++ b/tests/testapplications/listview/viewTransitions.qml
@@ -0,0 +1,479 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the test suite 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: root
+ width: 450; height: 600
+
+ property int currentSet: 0
+ property bool useStock: false
+
+ Component {
+ id: viewDelegate
+
+ Rectangle {
+ id: item
+ property bool movn: false
+ property int parts: 0
+
+ width: 225; height: 40
+ border.width: ListView.isCurrentItem ? 3 : 1
+ z: ListView.isCurrentItem ? 100 : 1
+ color: original ? "lightsteelblue" : "yellow"
+ objectName: name
+ Text { x: 10; text: name; font.pixelSize: 20 }
+ MouseArea { anchors.fill: parent; onClicked: listview.currentIndex = index }
+
+ Emitter {
+ id: emitter
+ system: ps
+ anchors.fill: parent
+ enabled: false
+ speed: AngleDirection {
+ angle: 0
+ angleVariation: 360
+ magnitude: 50
+ magnitudeVariation: 50
+ }
+ }
+ Emitter {
+ id: emitter2
+ system: ps
+ anchors.fill: parent
+ enabled: item.movn
+ emitRate: parts
+ speed: AngleDirection {
+ angle: 0
+ angleVariation: 360
+ magnitude: 2
+ magnitudeVariation: 5
+ }
+ }
+ }
+ }
+
+ ListView {
+ id: listview
+ width: 225; height: 500
+ anchors.centerIn: parent
+ delegate: viewDelegate
+ header: Rectangle {
+ height: 50; width: 225
+ color: "blue"
+ Text { anchors.centerIn: parent; text: "Transitions!"; color: "goldenrod" }
+ }
+ model: ListModel {
+ id: a_model
+ ListElement { name: "Item A"; original: true }
+ ListElement { name: "Item B"; original: true }
+ ListElement { name: "Item C"; original: true }
+ ListElement { name: "Item D"; original: true }
+ ListElement { name: "Item E"; original: true }
+ ListElement { name: "Item F"; original: true }
+ }
+ Rectangle {
+ anchors.fill: parent
+ color: "transparent"
+ border.color: "black"
+ }
+
+ }
+
+ ParticleSystem {
+ id: ps
+ ImageParticle {
+ id: imageparticle
+ source: "star.png"
+ color: "red"
+ }
+ }
+
+
+ /* States (Selected operation Transitions) */
+ states: [
+ State {
+ name: "setA"
+ when: currentSet == 0
+ PropertyChanges {
+ target: listview
+ add: a_add
+ move: a_move
+ remove: a_remove
+ displaced: a_displaced
+ }
+ },
+ State {
+ name: "setB"
+ when: currentSet == 1
+ PropertyChanges {
+ target: listview
+ add: b_add
+ move: b_move
+ remove: b_remove
+ displaced: b_displaced
+ }
+ },
+ State {
+ name: "setC"
+ when: currentSet == 2
+ PropertyChanges {
+ target: listview
+ add: c_add
+ move: c_move
+ remove: c_remove
+ addDisplaced: c_addDisplaced
+ moveDisplaced: c_moveDisplaced
+ removeDisplaced: c_removeDisplaced
+ }
+ },
+ State {
+ name: "setD"
+ when: currentSet == 3
+ PropertyChanges {
+ target: listview
+ move: d_move
+ moveDisplaced: d_moveDisplaced
+ }
+ PropertyChanges {
+ target: root
+ useStock: true
+ }
+ }
+ ]
+
+ /* Transitions */
+ Transition {
+ id: a_add
+ ParallelAnimation {
+ NumberAnimation { target: a_add.ViewTransition.item; properties: "opacity"; from: 0; to: 1; duration: 1000 }
+ }
+ }
+ Transition {
+ id: a_remove
+ SequentialAnimation {
+ NumberAnimation { target: a_remove.ViewTransition.item; properties: "opacity"; from: 1; to: 0; duration: 1000 }
+ }
+ }
+ Transition {
+ id: a_move
+ ColorAnimation { target: a_move.ViewTransition.item; properties: "color"; to: "lightsteelblue"; duration: 1000 }
+ PathAnimation {
+ duration: 1000
+ target: a_move.ViewTransition.item
+ path: Path {
+ PathCurve { x: a_move.ViewTransition.destination.x + 150; y: a_move.ViewTransition.destination.y + 100 }
+ PathCurve { x: a_move.ViewTransition.destination.x + 150; y: a_move.ViewTransition.destination.y }
+ PathCurve { x: a_move.ViewTransition.destination.x; y: a_move.ViewTransition.destination.y }
+ }
+ }
+ }
+ Transition {
+ id: a_displaced
+ PropertyAction { target: a_displaced.ViewTransition.item; property: "color"; value: "lightsteelblue" }
+ ParallelAnimation {
+ NumberAnimation { target: a_displaced.ViewTransition.item; property: "opacity"; to: 1; duration: 250 }
+ SequentialAnimation {
+ PauseAnimation { duration: a_displaced.ViewTransition.index * 200 }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutQuad }
+ }
+ }
+ }
+
+
+ Transition {
+ id: b_add
+ SequentialAnimation {
+ NumberAnimation { target: b_add.ViewTransition.item; properties: "scale"; from: 1; to: 1.3; duration: 100 }
+ NumberAnimation { target: b_add.ViewTransition.item; properties: "scale"; from: 1.3; to: 1; duration: 500; easing.type: Easing.OutBounce }
+ }
+ }
+ Transition {
+ id: b_move
+ SequentialAnimation {
+ PauseAnimation { duration: b_move.ViewTransition.index * 100 }
+ ParallelAnimation {
+ ColorAnimation { target: b_move.ViewTransition.item; properties: "color"; from: "red"; to: "lightsteelblue"; duration: 2000 }
+ SequentialAnimation {
+ PathAnimation {
+ duration: 1000
+ target: b_move.ViewTransition.item
+ path: Path {
+ PathCurve { x: b_move.ViewTransition.destination.x + 150; y: b_move.ViewTransition.destination.y + 100 }
+ PathCurve { relativeX: 30; relativeY: -100 }
+ }
+ }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutBounce }
+ }
+ }
+ }
+ }
+ Transition {
+ id: b_remove
+ SequentialAnimation {
+ NumberAnimation { target: b_remove.ViewTransition.item; properties: "opacity"; from: 1; to: 0; duration: 1000 }
+ }
+ }
+ Transition {
+ id: b_displaced
+ PropertyAction { target: b_displaced.ViewTransition.item; property: "color"; value: "lightsteelblue" }
+ SequentialAnimation {
+ PauseAnimation { duration: b_displaced.ViewTransition.item.x == 0 ? b_displaced.ViewTransition.index * 200 : 0 }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutBounce }
+ }
+ }
+
+
+ Transition {
+ id: c_add
+ NumberAnimation { property: "opacity"; from: 0; to: 1.0; duration: 400 }
+ NumberAnimation { property: "scale"; from: 0; to: 1.0; duration: 400 }
+ property int xoff
+ xoff: c_add.ViewTransition.index % 2 == 0 ? 200 : -200
+ PathAnimation {
+ duration: 1000
+ path: Path {
+ startX: c_add.ViewTransition.destination.x + c_add.xoff
+ startY: c_add.ViewTransition.destination.y + 200
+ PathCurve { relativeX: -100; relativeY: -50 }
+ PathCurve { relativeX: 50; relativeY: -150 }
+ PathCurve {
+ x: c_add.ViewTransition.destination.x
+ y: c_add.ViewTransition.destination.y
+ }
+ }
+ }
+ }
+ Transition {
+ id: c_move
+ ColorAnimation { target: c_move.ViewTransition.item; properties: "color"; from: "red"; to: "lightsteelblue"; duration: 1000 }
+ PathAnimation {
+ duration: 1000
+ target: c_move.ViewTransition.item
+ path: Path {
+ PathCurve { x: c_move.ViewTransition.destination.x + 150; y: c_move.ViewTransition.destination.y + 100 }
+ PathCurve { x: c_move.ViewTransition.destination.x + 150; y: c_move.ViewTransition.destination.y }
+ PathCurve { x: c_move.ViewTransition.destination.x; y: c_move.ViewTransition.destination.y }
+ }
+ }
+ }
+ Transition {
+ id: c_remove
+ PropertyAnimation { target: c_remove.ViewTransition.item; properties: "opacity"; to: 0; duration: 3000; easing.type: Easing.OutInBounce }
+ }
+ Transition {
+ id: c_addDisplaced
+
+ PropertyAction { property: "color"; value: "lightsteelblue" }
+ PropertyAction { property: "opacity"; value: 1.0 }
+ PropertyAction { property: "scale"; value: 1.0 }
+ SequentialAnimation {
+ PauseAnimation { duration: c_addDisplaced.ViewTransition.index * 200 }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutElastic }
+ }
+
+ }
+ Transition {
+ id: c_moveDisplaced
+
+ PropertyAction { property: "color"; value: "lightsteelblue" }
+ PropertyAction { property: "opacity"; value: 1.0 }
+ PropertyAction { property: "scale"; value: 1.0 }
+ SequentialAnimation {
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutBounce }
+ }
+
+ }
+ Transition {
+ id: c_removeDisplaced
+
+ PropertyAction { property: "color"; value: "lightsteelblue" }
+ PropertyAction { property: "opacity"; value: 1.0 }
+ PropertyAction { property: "scale"; value: 1.0 }
+ SequentialAnimation {
+ PauseAnimation { duration: (c_removeDisplaced.ViewTransition.index * 200) + 3000 }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutElastic }
+ }
+
+ }
+ Transition {
+ id: d_move
+ SequentialAnimation {
+ PropertyAction { target: d_move.ViewTransition.item; property: "movn"; value: true }
+ ParallelAnimation {
+ NumberAnimation { target: d_move.ViewTransition.item; properties: "opacity"; to: 0; duration: 2000 }
+ NumberAnimation { target: d_move.ViewTransition.item; properties: "parts"; to: 500; duration: 2000 }
+ }
+ NumberAnimation { properties: "x,y"; duration: 1000*(d_move.ViewTransition.index+1) }
+ ParallelAnimation {
+ NumberAnimation { target: d_move.ViewTransition.item; properties: "opacity"; to: 1; duration: 2000 }
+ NumberAnimation { target: d_move.ViewTransition.item; properties: "parts"; to: 0; duration: 2000 }
+ }
+ PropertyAction { target: d_move.ViewTransition.item; property: "movn"; value: false }
+ }
+ }
+
+ Transition {
+ id: d_moveDisplaced
+ PropertyAction { target: d_moveDisplaced.ViewTransition.item; property: "color"; value: "lightsteelblue" }
+ SequentialAnimation {
+ PauseAnimation { duration: 500*(d_moveDisplaced.ViewTransition.index+1) }
+ NumberAnimation { properties: "x,y"; duration: 1000; easing.type: Easing.OutQuad }
+ }
+ }
+
+ /* Buttons */
+ Column {
+ spacing: 2
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "To Top" }
+ MouseArea { anchors.fill: parent; onClicked: listview.model.move(listview.currentIndex, 0, 1) }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Add" }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.model.insert(listview.currentIndex+1, {"name": "New item", "original": false } )
+ }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Remove" }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.model.remove(listview.currentIndex)
+ }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Append" }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: listview.model.append({"name": "New item", "original": false })
+ }
+ }
+ }
+ Column {
+ spacing: 2
+ anchors.right: parent.right
+ anchors.rightMargin: 2
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: currentSet == 0 ? "green" : "lightgray"
+ ColorAnimation on color { duration: 1000 }
+ }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Set A" }
+ MouseArea { anchors.fill: parent; onClicked: { currentSet = 0 } }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: currentSet == 1 ? "green" : "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Set B" }
+ MouseArea { anchors.fill: parent; onClicked: { currentSet = 1 } }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: currentSet == 2 ? "green" : "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Set C" }
+ MouseArea { anchors.fill: parent; onClicked: { currentSet = 2 } }
+ }
+ Rectangle {
+ gradient: Gradient {
+ GradientStop { position: 0.0; color: "darkgray" }
+ GradientStop { position: 0.5; color: currentSet == 3 ? "green" : "lightgray" }
+ GradientStop { position: 1.0; color: "darkgray" }
+ }
+ radius: 6
+ border.color: "black"
+ height: 50; width: 80
+ Text { anchors.centerIn: parent; text: "Set D" }
+ MouseArea { anchors.fill: parent; onClicked: { currentSet = 3 } }
+ }
+ }
+}