git.iko.soy/unity8
on xenial help sign in
Added support and tests for expanding snap-decisions with more than 2 actions passed in. Switched to UbuntuAnimation and got rid of custom timing.js
b4a83d1Mirco Müller
Notifications/Notification.qml+109−12
compare with xenial
unifiedsplit
@@ -30,10 +30,25 @@ UbuntuShape {
30 property var type
30 property var type
31 property var notification
31 property var notification
32
32
33+ objectName: "background"
33− implicitHeight: childrenRect.height
34+ implicitHeight: contentColumn.height + contentColumn.spacing * 2
34 color: Qt.rgba(0, 0, 0, 0.85)
35 color: Qt.rgba(0, 0, 0, 0.85)
35 opacity: 0
36 opacity: 0
36
37
38+ clip: true
39+
40+ Behavior on implicitHeight {
41+ id: heightBehavior
42+
43+ enabled: false
44+ UbuntuNumberAnimation {
45+ duration: UbuntuAnimation.SnapDuration
46+ }
47+ }
48+
49+ // delay enabling height behavior until the add transition is complete
50+ onOpacityChanged: if (opacity == 1) heightBehavior.enabled = true
51+
37 MouseArea {
52 MouseArea {
38 id: interactiveArea
53 id: interactiveArea
39
54
@@ -52,7 +67,7 @@ UbuntuShape {
52 top: parent.top
67 top: parent.top
53 margins: spacing
68 margins: spacing
54 }
69 }
55− height: childrenRect.height + spacing
70+
56 spacing: units.gu(1)
71 spacing: units.gu(1)
57
72
58 Row {
73 Row {
@@ -125,30 +140,112 @@ UbuntuShape {
125 }
140 }
126 }
141 }
127
142
128− Row {
143+ Item {
129 id: buttonRow
144 id: buttonRow
130
145
131 objectName: "buttonRow"
146 objectName: "buttonRow"
132− spacing: contentColumn.spacing
147+ anchors {
133− layoutDirection: Qt.RightToLeft
148+ left: parent.left
149+ right: parent.right
150+ }
134 visible: notification.type == Notification.SnapDecision
151 visible: notification.type == Notification.SnapDecision
152+ height: units.gu(4)
153+
154+ property real buttonWidth: (width - contentColumn.spacing) / 2
155+ property bool expanded
156+
157+ Button {
158+ id: leftButton
159+
160+ objectName: "button1"
161+ width: parent.expanded ? parent.width : parent.buttonWidth
162+ anchors {
163+ top: parent.top
164+ bottom: parent.bottom
165+ }
166+ text: notification.type == Notification.SnapDecision && actionRepeater.count >= 2 ? actionRepeater.itemAt(1).actionLabel : ""
167+ color: "#cdcdcb"
168+ onClicked: {
169+ if (actionRepeater.count > 2) {
170+ buttonRow.expanded = !buttonRow.expanded
171+ } else {
172+ notification.notification.invokeAction(actionRepeater.itemAt(1).actionId)
173+ }
174+ }
175+
176+ Behavior on width {
177+ UbuntuNumberAnimation {
178+ duration: UbuntuAnimation.SnapDuration
179+ }
180+ }
181+ }
182+
183+ Button {
184+ id: rightButton
185+
186+ objectName: "button0"
187+ anchors {
188+ left: leftButton.right
189+ leftMargin: contentColumn.spacing
190+ right: parent.right
191+ }
192+ text: notification.type == Notification.SnapDecision && actionRepeater.count >= 1 ? actionRepeater.itemAt(0).actionLabel : ""
193+ anchors {
194+ top: parent.top
195+ bottom: parent.bottom
196+ }
197+ color: "#d85317"
198+ visible: width > 0
199+ onClicked: notification.notification.invokeAction(actionRepeater.itemAt(0).actionId)
200+ }
201+ }
202+
203+ Column {
204+ objectName: "buttonColumn"
205+ spacing: contentColumn.spacing
135 anchors {
206 anchors {
136 left: parent.left
207 left: parent.left
137 right: parent.right
208 right: parent.right
138 }
209 }
139
210
211+ // calculate initial position before Column takes over
212+ y: buttonRow.y + buttonRow.height + contentColumn.spacing
213+
214+ visible: notification.type == Notification.SnapDecision
215+ height: buttonRow.expanded ? implicitHeight : 0
216+
140 Repeater {
217 Repeater {
141 id: actionRepeater
218 id: actionRepeater
219+
142 model: notification.actions
220 model: notification.actions
221+ delegate: Loader {
222+ id: loader
143
223
144− Button {
145− objectName: "button" + index
146− color: Positioner.isFirstItem ? "#d85317" : "#cdcdcb"
147− width: (buttonRow.width - buttonRow.spacing) / 2
148− height: units.gu(4)
149− text: label
150 property string actionId: id
224 property string actionId: id
225+ property string actionLabel: label
226+
227+ anchors {
228+ left: parent.left
229+ right: parent.right
230+ }
231+
232+ Component {
233+ id: actionButton
234+
235+ Button {
236+ objectName: "button" + index
237+ anchors {
238+ left: parent.left
239+ right: parent.right
240+ }
241+
242+ text: loader.actionLabel
243+ height: units.gu(4)
244+ color: "#cdcdcb"
151− onClicked: notification.notification.invokeAction(id)
245+ onClicked: notification.notification.invokeAction(loader.actionId)
246+ }
247+ }
248+ sourceComponent: (index == 0 || index == 1) ? undefined : actionButton
152 }
249 }
153 }
250 }
154 }
251 }
Notifications/Notifications.qml+10−13
@@ -17,7 +17,6 @@
17import QtQuick 2.0
17import QtQuick 2.0
18import Ubuntu.Components 0.1
18import Ubuntu.Components 0.1
19import "../Components"
19import "../Components"
20−import "timings.js" as Timings
21
20
22ListView {
21ListView {
23 id: notificationList
22 id: notificationList
@@ -40,40 +39,38 @@ ListView {
40 actions: model.actions
39 actions: model.actions
41 notificationId: model.id
40 notificationId: model.id
42 notification: notificationList.model.getRaw(notificationId)
41 notification: notificationList.model.getRaw(notificationId)
42+
43+ // make sure there's no opacity-difference between the several
44+ // elements in a notification
45+ layer.enabled: add.running || remove.running || populate.running
43 }
46 }
44
47
45 populate: Transition {
48 populate: Transition {
46− NumberAnimation {
49+ UbuntuNumberAnimation {
47 property: "opacity"
50 property: "opacity"
48 to: 1
51 to: 1
49− duration: Timings.snapBeat
52+ duration: UbuntuAnimation.SnapDuration
50− easing.type: Timings.easing
51 }
53 }
52 }
54 }
53
55
54 add: Transition {
56 add: Transition {
55− NumberAnimation {
57+ UbuntuNumberAnimation {
56 property: "opacity"
58 property: "opacity"
57 to: 1
59 to: 1
58− duration: Timings.snapBeat
60+ duration: UbuntuAnimation.SnapDuration
59− easing.type: Timings.easing
60 }
61 }
61 }
62 }
62
63
63 remove: Transition {
64 remove: Transition {
64− NumberAnimation {
65+ UbuntuNumberAnimation {
65 property: "opacity"
66 property: "opacity"
66 to: 0
67 to: 0
67− duration: Timings.fastBeat
68− easing.type: Timings.easing
69 }
68 }
70 }
69 }
71
70
72 displaced: Transition {
71 displaced: Transition {
73− NumberAnimation {
72+ UbuntuNumberAnimation {
74 properties: "x,y"
73 properties: "x,y"
75− duration: Timings.fastBeat
76− easing.type: Timings.easing
77 }
74 }
78 }
75 }
79}
76}
Notifications/timings.jsdeleted−23
@@ -1,23 +0,0 @@
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− */
16−
17−var rhythm = 700;
18−var fastBeat = 0.5 * rhythm;
19−var snapBeat = 0.5 * fastBeat;
20−var slowBeat = rhythm;
21−var sleepyBeat = slowBeat * 2;
22−
23−var easing = Easing.OutQuint;
tests/qmltests/Notifications/tst_Notifications.qml+84−7
@@ -53,7 +53,10 @@ Row {
53 icon: "../graphics/avatars/funky.png",
53 icon: "../graphics/avatars/funky.png",
54 secondaryIcon: "../graphics/applicationIcons/facebook.png",
54 secondaryIcon: "../graphics/applicationIcons/facebook.png",
55 actions: [{ id: "ok_id", label: "Ok"},
55 actions: [{ id: "ok_id", label: "Ok"},
56− { id: "cancel_id", label: "Cancel"}]
56+ { id: "cancel_id", label: "Cancel"},
57+ { id: "notreally_id", label: "Not really"},
58+ { id: "noway_id", label: "No way"},
59+ { id: "nada_id", label: "Nada"}]
57 }
60 }
58
61
59 mockModel.append(n)
62 mockModel.append(n)
@@ -132,7 +135,7 @@ Row {
132 id: interactiveControls
135 id: interactiveControls
133
136
134 width: units.gu(30)
137 width: units.gu(30)
135− height: units.gu(71)
138+ height: units.gu(81)
136 color: "grey"
139 color: "grey"
137
140
138 Column {
141 Column {
@@ -193,7 +196,10 @@ Row {
193 icon: "../graphics/avatars/funky.png",
196 icon: "../graphics/avatars/funky.png",
194 secondaryIcon: "../graphics/applicationIcons/facebook.png",
197 secondaryIcon: "../graphics/applicationIcons/facebook.png",
195 actions: [{ id: "ok_id", label: "Ok"},
198 actions: [{ id: "ok_id", label: "Ok"},
196− { id: "cancel_id", label: "Cancel"}],
199+ { id: "cancel_id", label: "Cancel"},
200+ { id: "notreally_id", label: "Not really"},
201+ { id: "noway_id", label: "No way"},
202+ { id: "nada_id", label: "Nada"}],
197 summaryVisible: true,
203 summaryVisible: true,
198 bodyVisible: true,
204 bodyVisible: true,
199 interactiveAreaEnabled: false,
205 interactiveAreaEnabled: false,
@@ -299,6 +305,39 @@ Row {
299 actionSpy.clear()
305 actionSpy.clear()
300 }
306 }
301
307
308+ /*Timer {
309+ id: timerTestNotificationRenderer
310+
311+ interval: 100
312+ repeat: true
313+ running: true
314+ property int hsecond: 0
315+ property bool testPass: false
316+  onTriggered: {
317+
318+ try {
319+ var heightAfterExpand = notification.height
320+
321+ if(initialHeight < heightAfterExpand) {
322+ testPass: true
323+ verify(testPass = true, "height of expanded snap-decision is not the greater than its initial height")
324+ stop()
325+ }
326+ }
327+ catch(err) {
328+ // do nothing
329+ }
330+
331+ // wait 2 seconds
332+ if(hsecond > 20) {
333+ verify(testPass = true, "height of expanded snap-decision is not the greater than its initial height")
334+ stop()
335+ }
336+
337+ hsecond++
338+ }
339+ }*/
340+
302 function test_NotificationRenderer(data) {
341 function test_NotificationRenderer(data) {
303 // populate model with some mock notifications
342 // populate model with some mock notifications
304 mockModel.append(data)
343 mockModel.append(data)
@@ -341,15 +380,53 @@ Row {
341 var buttonAccept = findChild(buttonRow, "button0")
380 var buttonAccept = findChild(buttonRow, "button0")
342
381
343 waitForRendering(notification)
382 waitForRendering(notification)
344− mouseClick(buttonCancel, buttonCancel.width / 2, buttonCancel.height / 2)
345− actionSpy.wait()
346− compare(actionSpy.signalArguments[0][0], data.actions[1]["id"], "got wrong id for negative action")
347− actionSpy.clear()
348
383
384+ // only test the left/cancel-button if two actions have been passed in
385+ if (data.actions.length == 2) {
386+ mouseClick(buttonCancel, buttonCancel.width / 2, buttonCancel.height / 2)
387+ actionSpy.wait()
388+ compare(actionSpy.signalArguments[0][0], data.actions[1]["id"], "got wrong id for negative action")
389+ actionSpy.clear()
390+ }
391+
392+ // click the positive/right button
349 mouseClick(buttonAccept, buttonAccept.width / 2, buttonAccept.height / 2)
393 mouseClick(buttonAccept, buttonAccept.width / 2, buttonAccept.height / 2)
350 actionSpy.wait()
394 actionSpy.wait()
351 compare(actionSpy.signalArguments[0][0], data.actions[0]["id"], "got wrong id positive action")
395 compare(actionSpy.signalArguments[0][0], data.actions[0]["id"], "got wrong id positive action")
352 actionSpy.clear()
396 actionSpy.clear()
397+
398+ // check if there's more than one negative choice
399+ if (data.actions.length > 2) {
400+ var initialHeight = notification.height
401+
402+ // click to expand
403+ mouseClick(buttonCancel, buttonCancel.width / 2, buttonCancel.height / 2)
404+ waitForRendering(notification)
405+ actionSpy.clear()
406+ 
407+ //timerTestNotificationRenderer.start()
408+
409+ // test the additional buttons
410+ for (var i = 2; i < data.actions.length; i++) {
411+ waitForRendering(notification)
412+ var buttonColumn = findChild(notification, "buttonColumn")
413+ var button = findChild(buttonColumn, "button" + i)
414+
415+ mouseClick(button, button.width / 2, button.height / 2)
416+ actionSpy.wait()
417+ compare(actionSpy.signalArguments[0][0], data.actions[i]["id"], "got wrong id for additional negative action")
418+ actionSpy.clear()
419+ }
420+
421+ // click to collapse
422+ mouseClick(buttonCancel, buttonCancel.width / 2, buttonCancel.height / 2)
423+ waitForRendering(notification)
424+ tryCompare(notification, "height", initialHeight)
425+ } else {
426+ mouseClick(buttonCancel, buttonCancel.width / 2, buttonCancel.height / 2)
427+ actionSpy.wait()
428+ compare(actionSpy.signalArguments[0][0], data.actions[1]["id"], "got wrong id for negative action")
429+ }
353 }
430 }
354 }
431 }
355 }
432 }