git.iko.soy/unity8
on 7cd287d help sign in
unity8/Components/EdgeDemoOverlay.qml
273 lines 8.4 kB history raw
1/*
2 * Copyright (C) 2013 Canonical, Ltd.
3 *
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU General Public License as published by
6 * the Free Software Foundation; version 3.
7 *
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU General Public License for more details.
12 *
13 * You should have received a copy of the GNU General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
15 */
17import Powerd 0.1
18import QtQuick 2.0
19import QtGraphicalEffects 1.0
20import Unity.Application 0.1
21import Ubuntu.Components 0.1
23Showable {
24 id: overlay
26 /*
27 * Valid values are "left", "right", "top", "bottom", or "none".
28 */
29 property string edge: "top"
31 /*
32 * This is the header displayed, like "Right edge".
33 */
34 property alias title: titleLabel.text
36 /*
37 * This is the block of text displayed below the header.
38 */
39 property alias text: textLabel.text
41 /*
42 * This is the text for the skip button.
43 */
44 property alias skipText: skipLabel.text
46 /*
47 * This is the visible status of the skip button.
48 */
49 property alias showSkip: skipLabel.visible
51 /*
52 * Whether this demo is running currently.
53 */
54 readonly property bool active: available && visible
56 /*
57 * Whether animations are paused.
58 */
59 property alias paused: wholeAnimation.paused
61 /*
62 * Whether animations are running.
63 */
64 readonly property alias running: wholeAnimation.running
66 signal skip()
68 function doSkip() {
69 d.skipOnHide = true;
70 hide();
71 }
73 function hideNow() {
74 overlay.visible = false;
75 overlay.available = false;
76 if (d.skipOnHide) {
77 overlay.skip();
78 }
79 }
81 showAnimation: StandardAnimation {
82 property: "opacity"
83 to: 1
84 onRunningChanged: if (running) overlay.visible = true
85 }
86 hideAnimation: StandardAnimation {
87 property: "opacity"
88 to: 0
89 duration: UbuntuAnimation.BriskDuration
90 onRunningChanged: if (!running) overlay.hideNow()
91 }
93 QtObject {
94 id: d
95 property bool skipOnHide: false
96 property int edgeMargin: units.gu(4)
97 }
99 Rectangle {
100 objectName: "backgroundShade"
102 anchors.fill: parent
103 color: "black"
104 opacity: 0.8
105 visible: overlay.active
107 MouseArea {
108 objectName: "backgroundShadeMouseArea"
110 anchors.fill: parent
111 enabled: overlay.edge == "none" && overlay.opacity == 1.0
112 onClicked: overlay.doSkip()
113 }
114 }
116 Item {
117 id: hintGroup
118 x: 0
119 y: 0
120 width: parent.width
121 height: parent.height
122 visible: overlay.active
124 Column {
125 id: labelGroup
126 spacing: units.gu(3)
128 anchors {
129 margins: d.edgeMargin
130 left: parent.left
131 top: overlay.edge == "bottom" ? undefined : parent.top
132 bottom: overlay.edge == "bottom" ? parent.bottom : undefined
133 }
135 Label {
136 id: titleLabel
137 fontSize: "x-large"
138 width: units.gu(25)
139 wrapMode: Text.WordWrap
140 }
142 Label {
143 id: textLabel
144 width: units.gu(25)
145 wrapMode: Text.WordWrap
146 }
148 Label {
149 id: skipLabel
150 objectName: "skipLabel"
151 text: i18n.tr("Skip intro")
152 color: UbuntuColors.orange
153 fontSize: "small"
155 Icon {
156 anchors.left: parent.right
157 anchors.verticalCenter: parent.verticalCenter
158 height: units.dp(12)
159 width: units.dp(12)
160 name: "chevron"
161 color: UbuntuColors.orange
162 }
164 MouseArea {
165 // Make clickable area bigger than just the link because
166 // otherwise, the edge demo will feel hard to dismiss.
167 anchors.fill: parent
168 anchors.margins: -units.gu(5)
169 onClicked: overlay.doSkip()
170 }
171 }
172 }
174 LinearGradient {
175 id: edgeHint
176 property int size: 1
177 cached: false
178 visible: overlay.edge != "none"
179 gradient: Gradient {
180 GradientStop {
181 position: 0.0
182 color: Qt.hsla(16.0/360.0, 0.83, 0.47, 0.4) // UbuntuColors.orange, but transparent
183 }
184 GradientStop {
185 position: 1.0
186 color: "transparent"
187 }
188 }
189 anchors.fill: parent
190 start: {
191 if (overlay.edge == "right") {
192 return Qt.point(width, 0);
193 } else if (overlay.edge == "left") {
194 return Qt.point(0, 0);
195 } else if (overlay.edge == "top") {
196 return Qt.point(0, 0);
197 } else {
198 return Qt.point(0, height);
199 }
200 }
201 end: {
202 if (overlay.edge == "right") {
203 return Qt.point(width - size, 0);
204 } else if (overlay.edge == "left") {
205 return Qt.point(size, 0);
206 } else if (overlay.edge == "top") {
207 return Qt.point(0, size);
208 } else {
209 return Qt.point(0, height - size);
210 }
211 }
212 }
213 }
215 SequentialAnimation {
216 id: wholeAnimation
217 objectName: "wholeAnimation"
218 running: overlay.active
220 ParallelAnimation {
221 id: fadeInAnimation
223 StandardAnimation {
224 target: labelGroup
225 property: {
226 if (overlay.edge == "right" || overlay.edge == "left") {
227 return "anchors.leftMargin";
228 } else if (overlay.edge == "bottom") {
229 return "anchors.bottomMargin";
230 } else {
231 return "anchors.topMargin";
232 }
233 }
234 from: {
235 if (overlay.edge == "right") {
236 return d.edgeMargin + units.gu(3)
237 } else {
238 return d.edgeMargin - units.gu(3)
239 }
240 }
241 to: d.edgeMargin
242 duration: overlay.edge == "none" ? 0 : UbuntuAnimation.SleepyDuration
243 }
244 StandardAnimation {
245 target: overlay
246 property: "opacity"
247 from: 0.0
248 to: 1.0
249 duration: UbuntuAnimation.SleepyDuration
250 }
251 }
253 SequentialAnimation {
254 id: hintAnimation
255 loops: Animation.Infinite
256 property string prop: (overlay.edge == "left" || overlay.edge == "right") ? "x" : "y"
257 property double endVal: units.dp(5) * ((overlay.edge == "left" || overlay.edge == "top") ? 1 : -1)
258 property double maxGlow: units.dp(20)
259 property int duration: overlay.edge == "none" ? 0 : UbuntuAnimation.SleepyDuration
261 ParallelAnimation {
262 StandardAnimation { target: hintGroup; property: hintAnimation.prop; from: 0; to: hintAnimation.endVal; duration: hintAnimation.duration }
263 StandardAnimation { target: edgeHint; property: "size"; from: 1; to: hintAnimation.maxGlow; duration: hintAnimation.duration }
264 }
266 // Undo the above
267 ParallelAnimation {
268 StandardAnimation { target: hintGroup; property: hintAnimation.prop; from: hintAnimation.endVal; to: 0; duration: hintAnimation.duration }
269 StandardAnimation { target: edgeHint; property: "size"; from: hintAnimation.maxGlow; to: 1; duration: hintAnimation.duration }
270 }
271 }
272 }