Minor bug fixes for TransitionView

 * Adding more effects and options for effects
 * Fixing a few minor issues

Change-Id: Ia5634e8fd9a5d1b8b0897535ad886a3abdffbdf3
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

6 files changed, 220 insertions, 20 deletions

diff --git a/examples/TransitionItem/imports/TransitionView/PageEffect.qml b/examples/TransitionItem/imports/TransitionView/PageEffect.qml
index 0f11346..c2cd5d4 100644
--- a/examples/TransitionItem/imports/TransitionView/PageEffect.qml
+++ b/examples/TransitionItem/imports/TransitionView/PageEffect.qml
@@ -46,10 +46,6 @@ QtObject {
 
         resetProperties()
 
-         for (var i = 0; i <  transitionView.__fromContentItem.children.length; ++i) {
-             print("letf over 1")
-         }
-
         from.parent = transitionView.__fromContentItem
         to.parent = transitionView.__toContentItem
         root.progress = root.backwards ? 100 : 0
@@ -59,17 +55,21 @@ QtObject {
         root.progress = 0
     }
 
+    property bool __aborted: false
+
     function enable() {
         timeline.enabled = true
         root.started()
     }
 
     function start() {
-        anim.from = root.progress
+        anim.from = Math.min(root.progress, 100)
         anim.to = root.backwards ? 0 : 100
-        anim.duration = root.duration * Math.abs(anim.from - anim.to) / 100
+        anim.duration = root.duration * Math.abs(anim.to - anim.from) / 100
 
-        anim.restart()
+        root.__aborted = false
+
+        anim.start()
     }
 
     function abort() {
@@ -79,7 +79,7 @@ QtObject {
 
         anim.duration = root.duration * Math.abs(anim.from - anim.to) / 100
 
-        root.transitionView.nextItem = root.transitionView.currentItem
+        root.__aborted = true
         anim.restart()
 
     }
@@ -137,7 +137,18 @@ QtObject {
             resetProperties()
 
             root.finished()
-            root.transitionView.__setupCurrentItem()
+
+            if (!root.__aborted) {
+                root.transitionView.__setupCurrentItem()
+            } else {
+                if (root.transitionView.nextItem) {
+                    root.transitionView.nextItem.parent = transitionView.__stack
+                    root.transitionView.nextItem = root.transitionView.currentItem
+                }
+                root.transitionView.__setupCurrentItem()
+                root.transitionView.nextItem = null
+            }
+
             root.progress = 0
         }
     }
diff --git a/examples/TransitionItem/imports/TransitionView/PagePushUpEffect.qml b/examples/TransitionItem/imports/TransitionView/PagePushUpEffect.qml
new file mode 100644
index 0000000..1dfe306
--- /dev/null
+++ b/examples/TransitionItem/imports/TransitionView/PagePushUpEffect.qml
@@ -0,0 +1,163 @@
+/****************************************************************************
+**
+** Copyright (C) 2018 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of Qt Quick Designer Components.
+**
+** $QT_BEGIN_LICENSE:GPL$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 3 or (at your option) any later version
+** approved by the KDE Free Qt Foundation. The licenses are as published by
+** the Free Software Foundation and appearing in the file LICENSE.GPL3
+** included in the packaging of this file. Please review the following
+** information to ensure the GNU General Public License requirements will
+** be met: https://www.gnu.org/licenses/gpl-3.0.html.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.10
+import TransitionItem 1.0
+import QtQuick.Timeline 1.0
+
+PageEffect {
+    id: effect
+
+    property real scale: 1
+    property real inOpacity: 1
+    property real outOpacity: 1
+
+    property int fromItemHeight: effect.transitionView.height
+
+    property bool revealCurrent: false
+
+    duration: 250
+    onStarted: {
+        group01.target = transitionView.__fromContentItem
+        group02.target = transitionView.__toContentItem
+        group03.target = transitionView.__fromContentItem
+        group04.target = transitionView.__toContentItem
+        group05.target = transitionView.__fromContentItem
+        group06.target = transitionView.__toContentItem
+        if (effect.revealCurrent)
+            group01.target.z = 1
+    }
+
+    timeline: Timeline {
+        startFrame: 0
+        endFrame: 1000
+
+        KeyframeGroup {
+            id: group01
+
+            property: "y"
+
+            Keyframe {
+                frame: 0
+                value: 0
+            }
+
+            Keyframe {
+                frame: 1000
+                value: -fromItemHeight
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group02
+
+            property: "y"
+
+            Keyframe {
+                frame: 0
+                value: effect.revealCurrent ? 0 : effect.transitionView.height
+            }
+
+            Keyframe {
+                frame: 1000
+                value: 0
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group03
+
+            property: "scale"
+
+            Keyframe {
+                frame: 0
+                value: 1
+            }
+
+            Keyframe {
+                frame: 1000
+                value: effect.scale
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group04
+
+            property: "scale"
+
+            Keyframe {
+                frame: 0
+                value: effect.scale
+            }
+
+            Keyframe {
+                frame: 1000
+                value: 1
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group05
+
+            property: "opacity"
+
+            Keyframe {
+                frame: 0
+                value: 1
+            }
+
+            Keyframe {
+                frame: 1000
+                value: effect.outOpacity
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group06
+
+            property: "opacity"
+
+            Keyframe {
+                frame: 0
+                value: effect.inOpacity
+            }
+
+            Keyframe {
+                frame: 1000
+                value: 1
+                easing: effect.easing
+            }
+        }
+    }
+}
diff --git a/examples/TransitionItem/imports/TransitionView/PageSlideDownEffect.qml b/examples/TransitionItem/imports/TransitionView/PageSlideDownEffect.qml
index df31a26..9731b06 100644
--- a/examples/TransitionItem/imports/TransitionView/PageSlideDownEffect.qml
+++ b/examples/TransitionItem/imports/TransitionView/PageSlideDownEffect.qml
@@ -34,10 +34,14 @@ import QtQuick.Timeline 1.0
 PageEffect {
     id: effect
 
+    property real itemHeight: transitionView.height
+    property real outOpacity: 1
+
     duration: 250
     onStarted: {
-        group01.target = transitionView.__fromContentItem
-        group01 .target.z = 1
+        group01.target = transitionView.__toContentItem
+        group02.target = transitionView.__fromContentItem
+        group01.target.z = 1
     }
 
     timeline: Timeline {
@@ -51,12 +55,29 @@ PageEffect {
 
             Keyframe {
                 frame: 0
+                value: -effect.itemHeight
+            }
+
+            Keyframe {
+                frame: 1000
                 value: 0
+                easing: effect.easing
+            }
+        }
+
+        KeyframeGroup {
+            id: group02
+
+            property: "opacity"
+
+            Keyframe {
+                frame: 0
+                value: 1
             }
 
             Keyframe {
                 frame: 1000
-                value: transitionView.height
+                value: effect.outOpacity
                 easing: effect.easing
             }
         }
diff --git a/examples/TransitionItem/imports/TransitionView/SwipeInteraction.qml b/examples/TransitionItem/imports/TransitionView/SwipeInteraction.qml
index df2fa58..37a29ce 100644
--- a/examples/TransitionItem/imports/TransitionView/SwipeInteraction.qml
+++ b/examples/TransitionItem/imports/TransitionView/SwipeInteraction.qml
@@ -85,7 +85,6 @@ Item {
         }
 
         onActiveChanged: {
-
             if (handler.active) {
                 if (distance() < 0)
                     transitionView.nextItem = list.nextItem
@@ -93,15 +92,17 @@ Item {
                     transitionView.nextItem = list.prevItem
 
                 transitionView.scheduleTransition()
-                transitionView.currentTransition.effect.enable()
+                if (transitionView.currentTransition)
+                    transitionView.currentTransition.effect.enable()
             } else {
                 var p = Math.abs(distance()) * 100
-                if (transitionView.currentTransition.effect.progress > root.threshold) {
+                if (transitionView.currentTransition && transitionView.currentTransition.effect.progress > root.threshold) {
                     root.__activeItem = transitionView.nextItem
                     root.__reactToTransition = true
                     transitionView.currentTransition.__start()
-                } else {
-                    transitionView.currentTransition.effect.abort()
+                } else { /* Drag was released, but threshold was not passed */
+                    if (transitionView.currentTransition)
+                        transitionView.currentTransition.effect.abort()
                 }
                 /* Block for 100ms */
                 handler.enabled = false
@@ -112,8 +113,8 @@ Item {
         onCentroidChanged: {
             var p = Math.abs(distance()) * 100
 
-            if (view.currentTransition)
-                view.currentTransition.effect.progress = p * 2
+            if (transitionView.currentTransition)
+                transitionView.currentTransition.effect.progress = p * 2
         }
     }
 }
diff --git a/examples/TransitionItem/imports/TransitionView/TransitionView.qml b/examples/TransitionItem/imports/TransitionView/TransitionView.qml
index a00747c..1f4576a 100644
--- a/examples/TransitionItem/imports/TransitionView/TransitionView.qml
+++ b/examples/TransitionItem/imports/TransitionView/TransitionView.qml
@@ -66,6 +66,8 @@ Item {
 
     signal transitionFinished
 
+    property alias __stack: stack
+
     Item {
         id: stack
         visible: false
@@ -155,7 +157,8 @@ Item {
         __forceTransition = null
 
         root.currentTransition = pageTransition
-        root.currentTransition.__reset(root.currentItem, root.nextItem)
+        if (root.currentTransition)
+            root.currentTransition.__reset(root.currentItem, root.nextItem)
 
         root.progress = Qt.binding(function () {
             if (root.currentTransition)
diff --git a/examples/TransitionItem/imports/TransitionView/qmldir b/examples/TransitionItem/imports/TransitionView/qmldir
index 8217ba0..11bf275 100644
--- a/examples/TransitionItem/imports/TransitionView/qmldir
+++ b/examples/TransitionItem/imports/TransitionView/qmldir
@@ -11,4 +11,5 @@ PageSlideUpEffect 1.0 PageSlideUpEffect.qml
 PageTransition 1.0 PageTransition.qml
 TransitionList 1.0 TransitionList.qml
 TransitionView 1.0 TransitionView.qml
+PagePushUpEffect 1.0 PagePushUpEffect.qml