@@ -19,14 +19,30 @@ import QtQuick 2.0
20 id: container
20 id: container
21 property Item surface: null
21 property Item surface: null
22− property string animation
22+ readonly property alias surfaceArea: _surfaceArea
23− property bool show: false
23+ property bool removing: false
25 onSurfaceChanged: {
25 onSurfaceChanged: {
26 if (surface) {
26 if (surface) {
27 surface.parent = container;
27 surface.parent = container;
28− surface.anchors.fill = container;
29 surface.z = 1;
28 surface.z = 1;
41+ if (surface.parentSurface) {
42+ surface.parentSurface.parent.animateOut();
44+ container.removing = true;
@@ -35,60 +51,126 @@ Item {
36 delegate: Loader {
52 delegate: Loader {
38− anchors.fill: surface
54+ anchors.fill: surfaceArea
40 // Only way to do recursive qml items.
56 // Only way to do recursive qml items.
41 source: Qt.resolvedUrl("SurfaceContainer.qml")
57 source: Qt.resolvedUrl("SurfaceContainer.qml")
42 onLoaded: {
58 onLoaded: {
43− item.parent = container.surface;
44 item.surface = modelData;
59 item.surface = modelData;
45− item.animation = "overlaySwipeBottom"
60+ item.animateIn("swipeFromBottom");
46− item.show = true;
61+ container.animateIn("swipeUp");
66+ function animateIn(type) {
67+ var tmp = d.animations;
71+ container.state = d.currentAnimation + "-prep";
72+ container.state = d.currentAnimation + "-in";
75+ function animateOut() {
76+ if (d.animations.length > 0) {
77+ var tmp = d.animations;
78+ var popped = tmp.pop();
80+ container.state = popped + "-out";
81+ if (d.currentAnimation !== "") {
82+ container.state = d.currentAnimation + "-in";
85+ container.state = "initial";
91+ property variant animations: []
92+ property string currentAnimation: animations.length > 0 ? animations[animations.length-1] : ""
98+ PropertyChanges { target: surface; anchors.fill: surfaceArea }
53 name: "baseAnimation"
102 name: "baseAnimation"
54 PropertyChanges { target: surface; anchors.fill: undefined }
103 PropertyChanges { target: surface; anchors.fill: undefined }
58− name: "overlaySwipeBottom-out"
107+ name: "swipeFromBottom-prep"
59 extend: "baseAnimation"
108 extend: "baseAnimation"
60− when: surface && animation === "overlaySwipeBottom" && !show
61− AnchorChanges { target: surface; anchors.top: surface.parent.bottom }
109+ AnchorChanges { target: surface; anchors.top: surfaceArea.bottom }
64− name: "overlaySwipeBottom-in"
112+ name: "swipeFromBottom-out"
113+ extend: "swipeFromBottom-prep"
116+ name: "swipeFromBottom-in"
65 extend: "baseAnimation"
117 extend: "baseAnimation"
66− when: surface && animation === "overlaySwipeBottom" && show
67− AnchorChanges { target: surface; anchors.top: surface.parent.top }
118+ AnchorChanges { target: surface; anchors.top: surfaceArea.top }
122+ name: "swipeUp-prep"
123+ extend: "baseAnimation"
127+ extend: "swipeUp-prep"
131+ extend: "baseAnimation"
132+ AnchorChanges { target: surface; anchors.bottom: surfaceArea.top }
70 // TODO: more animations!
134 // TODO: more animations!
71− // Surface needs to stick around so that we can dimiss them with animation.
74 transitions: [
137 transitions: [
75 Transition {
138 Transition {
76− from: "overlaySwipeBottom-out"
139+ to: "swipeFromBottom-in"
77− to: "overlaySwipeBottom-in"
140+ SequentialAnimation {
141+ PropertyAction { target: surface.parent; property: "clip"; value: true }
142+ AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
143+ PropertyAction { target: surface.parent; property: "clip"; value: false }
147+ to: "swipeFromBottom-out"
78 SequentialAnimation {
148 SequentialAnimation {
79− PropertyAction { target: surface.parent; property: "clip"; value: true}
149+ PropertyAction { target: surface.parent; property: "clip"; value: true }
80 AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
150 AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
151+ PropertyAction { target: surface; property: "visible"; value: !removing }
81− PropertyAction { target: surface.parent; property: "clip"; value: false}
152+ PropertyAction { target: surface.parent; property: "clip"; value: false }
153+ ScriptAction { script: { if (container.removing) surface.release() } }
84 Transition {
157 Transition {
85− from: "overlaySwipeBottom-in"
158+ to: "swipeUp-in"
86− to: "overlaySwipeBottom-out"
87 SequentialAnimation {
159 SequentialAnimation {
88− PropertyAction { target: surface.parent; property: "clip"; value: true}
160+ PropertyAction { target: surface.parent; property: "clip"; value: true }
89 AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
161 AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
90 PropertyAction { target: surface; property: "visible"; value: false}
162 PropertyAction { target: surface; property: "visible"; value: false}
91− PropertyAction { target: surface.parent; property: "clip"; value: false}
163+ PropertyAction { target: surface.parent; property: "clip"; value: false }
168+ SequentialAnimation {
169+ PropertyAction { target: surface.parent; property: "clip"; value: true }
170+ PropertyAction { target: surface; property: "visible"; value: true }
171+ AnchorAnimation { easing.type: Easing.InOutQuad; duration: 400 }
172+ PropertyAction { target: surface.parent; property: "clip"; value: false }
173+ ScriptAction { script: { if (container.removing) surface.release() } }