on xenial help sign in
Make launcher demo transitions smoother
cac9b59Michael Terry
Components/DemoOverlay.qml+30−23
@@ -19,7 +19,7 @@ import QtGraphicalEffects 1.0
19import Ubuntu.Application 0.1
19import Ubuntu.Application 0.1
20import Ubuntu.Components 0.1
20import Ubuntu.Components 0.1
21
21
22−Item {
22+Showable {
23 id: overlay
23 id: overlay
24
24
25 /*
25 /*
@@ -42,24 +42,45 @@ Item {
42 */
42 */
43 property string skipText: i18n.tr("Skip intro")
43 property string skipText: i18n.tr("Skip intro")
44
44
45− /*
46− * Whether this demo is allowed to run.
47− */
48− property bool enabled: true
49−
50 /*
45 /*
51 * Whether this demo is running currently.
46 * Whether this demo is running currently.
52 */
47 */
53− readonly property bool active: enabled && visible
48+ readonly property bool active: available && visible
54
49
55 property color __orange: Qt.hsla(16.0/360.0, 0.83, 0.47, 1.0)
50 property color __orange: Qt.hsla(16.0/360.0, 0.83, 0.47, 1.0)
56 property color __orange_transparent: Qt.hsla(16.0/360.0, 0.83, 0.47, 0.4)
51 property color __orange_transparent: Qt.hsla(16.0/360.0, 0.83, 0.47, 0.4)
57 property int __edge_margin: units.gu(4)
52 property int __edge_margin: units.gu(4)
58 property int __text_margin: units.gu(3)
53 property int __text_margin: units.gu(3)
54+ property bool __skip_on_hide: false
59 property int __anim_running: wholeAnimation.running // for testing
55 property int __anim_running: wholeAnimation.running // for testing
60
56
61 signal skip()
57 signal skip()
62
58
59+ function doSkip() {
60+ __skip_on_hide = true;
61+ hide();
62+ }
63+
64+ function hideNow() {
65+ overlay.visible = false;
66+ overlay.available = false;
67+ if (overlay.__skip_on_hide) {
68+ overlay.skip();
69+ }
70+ }
71+
72+ showAnimation: StandardAnimation {
73+ property: "opacity"
74+ to: 1
75+ onRunningChanged: if (running) overlay.visible = true
76+ }
77+ hideAnimation: StandardAnimation {
78+ property: "opacity"
79+ to: 0
80+ duration: UbuntuAnimation.BriskDuration
81+ onRunningChanged: if (!running) overlay.hideNow()
82+ }
83+
63 Rectangle {
84 Rectangle {
64 id: backgroundShade
85 id: backgroundShade
65 anchors.fill: parent
86 anchors.fill: parent
@@ -70,7 +91,7 @@ Item {
70 MouseArea {
91 MouseArea {
71 anchors.fill: parent
92 anchors.fill: parent
72 enabled: overlay.edge == "none" && overlay.opacity == 1.0
93 enabled: overlay.edge == "none" && overlay.opacity == 1.0
73− onClicked: fadeOutAnimation.running = true
94+ onClicked: overlay.doSkip()
74 }
95 }
75 }
96 }
76
97
@@ -119,7 +140,7 @@ Item {
119
140
120 MouseArea {
141 MouseArea {
121 anchors.fill: parent
142 anchors.fill: parent
122− onClicked: fadeOutAnimation.running = true
143+ onClicked: overlay.doSkip()
123 }
144 }
124 }
145 }
125 }
146 }
@@ -165,20 +186,6 @@ Item {
165 }
186 }
166 }
187 }
167
188
168− PropertyAnimation {
169− id: fadeOutAnimation
170− target: overlay
171− property: "opacity"
172− to: 0
173− duration: 250
174−
175− onStopped: {
176− overlay.enabled = false;
177− overlay.visible = false;
178− skip()
179− }
180− }
181−
182 SequentialAnimation {
189 SequentialAnimation {
183 id: wholeAnimation
190 id: wholeAnimation
184 running: overlay.active
191 running: overlay.active
Shell.qml+18−16
@@ -241,17 +241,17 @@ FocusScope {
241 text: i18n.tr("Try swiping from the top edge to access the indicators")
241 text: i18n.tr("Try swiping from the top edge to access the indicators")
242 anchors.fill: dash
242 anchors.fill: dash
243 visible: false
243 visible: false
244− enabled: shell.showEdgeDemo
244+ available: shell.showEdgeDemo
245 onSkip: shell.hideEdgeDemo()
245 onSkip: shell.hideEdgeDemo()
246
246
247 Connections {
247 Connections {
248 target: greeter
248 target: greeter
249− onShownChanged: if (!greeter.shown) topEdgeDemo.visible = true
249+ onShownChanged: if (!greeter.shown) topEdgeDemo.show()
250 }
250 }
251
251
252 Connections {
252 Connections {
253 target: panel.indicators
253 target: panel.indicators
254− onFullyOpenedChanged: if (panel.indicators.fullyOpened) topEdgeDemo.enabled = false
254+ onFullyOpenedChanged: if (panel.indicators.fullyOpened) topEdgeDemo.hideNow()
255 }
255 }
256 }
256 }
257
257
@@ -263,17 +263,17 @@ FocusScope {
263 text: i18n.tr("Swipe from the left to reveal the launcher for quick access to apps")
263 text: i18n.tr("Swipe from the left to reveal the launcher for quick access to apps")
264 anchors.fill: dash
264 anchors.fill: dash
265 visible: false
265 visible: false
266− enabled: shell.showEdgeDemo
266+ available: shell.showEdgeDemo
267 onSkip: shell.hideEdgeDemo()
267 onSkip: shell.hideEdgeDemo()
268
268
269 Connections {
269 Connections {
270 target: bottomEdgeDemo
270 target: bottomEdgeDemo
271− onActiveChanged: if (!bottomEdgeDemo.active) leftEdgeDemo.visible = true
271+ onActiveChanged: if (!bottomEdgeDemo.active) leftEdgeDemo.show()
272 }
272 }
273
273
274 Connections {
274 Connections {
275 target: launcher
275 target: launcher
276− onProgressChanged: if (launcher.progress >= 1.0) leftEdgeDemo.enabled = false
276+ onStateChanged: if (launcher.state == "visible") leftEdgeDemo.hide()
277 }
277 }
278 }
278 }
279 }
279 }
@@ -548,7 +548,7 @@ FocusScope {
548
548
549 function hide() {
549 function hide() {
550 if (rightEdgeDemo.active) {
550 if (rightEdgeDemo.active) {
551− rightEdgeDemo.enabled = false
551+ rightEdgeDemo.hide()
552 shell.hideEdgeDemoInGreeter()
552 shell.hideEdgeDemoInGreeter()
553 }
553 }
554 }
554 }
@@ -629,13 +629,13 @@ FocusScope {
629 text: i18n.tr("Swipe up again to close the settings screen")
629 text: i18n.tr("Swipe up again to close the settings screen")
630 anchors.fill: panel.indicators
630 anchors.fill: panel.indicators
631 visible: false
631 visible: false
632− enabled: shell.showEdgeDemo
632+ available: shell.showEdgeDemo
633 onSkip: shell.hideEdgeDemo()
633 onSkip: shell.hideEdgeDemo()
634
634
635 Connections {
635 Connections {
636 target: panel.indicators
636 target: panel.indicators
637− onFullyOpenedChanged: if (panel.indicators.fullyOpened) bottomEdgeDemo.visible = true
637+ onFullyOpenedChanged: if (panel.indicators.fullyOpened) bottomEdgeDemo.show()
638− onPartiallyOpenedChanged: if (!panel.indicators.partiallyOpened && !panel.indicators.fullyOpened) bottomEdgeDemo.enabled = false
638+ onPartiallyOpenedChanged: if (!panel.indicators.partiallyOpened && !panel.indicators.fullyOpened) bottomEdgeDemo.hideNow()
639 }
639 }
640 }
640 }
641 }
641 }
@@ -771,15 +771,17 @@ FocusScope {
771 skipText: i18n.tr("Finish")
771 skipText: i18n.tr("Finish")
772 anchors.fill: overlay
772 anchors.fill: overlay
773 visible: false
773 visible: false
774− enabled: shell.showEdgeDemo
774+ available: shell.showEdgeDemo
775− onSkip: {
776− launcher.hide();
777− shell.hideEdgeDemo();
775+ onSkip: shell.hideEdgeDemo()
778− }
779
776
780 Connections {
777 Connections {
781 target: leftEdgeDemo
778 target: leftEdgeDemo
779+ onActiveChanged: {
782− onActiveChanged: if (!leftEdgeDemo.active) finalEdgeDemo.visible = true
780+ if (!leftEdgeDemo.active) {
781+ finalEdgeDemo.show();
782+ launcher.hide();
783+ }
784+ }
783 }
785 }
784 }
786 }
785
787