on xenial help sign in
Add touchdown effect to dash cards.

Approved by: Ying-Chun Liu

commitc3d22631be681e99298b092bf27445159840a626 authorAndrea Cimitan <andrea.cimitan@gmail.com> dateWed 6 Aug 2014, 19:37 (12 years ago) parentc35c290a223069
10 files changed+103−6
plugins/Dash/CardCreator.js+21−1 tests/plugins/Dash/cardcreator/1.res+8 tests/plugins/Dash/cardcreator/2.res+8 tests/plugins/Dash/cardcreator/3.res+8 tests/plugins/Dash/cardcreator/4.res+8 tests/plugins/Dash/cardcreator/5.res+8 tests/plugins/Dash/cardcreator/6.res+8 tests/plugins/Dash/cardcreator/7.res+9−1 tests/plugins/Dash/cardcreatortest.cpp+13−4 tests/qmltests/Dash/tst_Card.qml+12
plugins/Dash/CardCreator.js+21−1
@@ -257,6 +257,16 @@ var kTitleLabelCode = 'Label { \n\
257257 horizontalAlignment: root.headerAlignment; \n\
258258 }\n';
259259
260+// %1 is used as anchors of touchdown effect
261+var kTouchdownCode = 'UbuntuShape { \n\
262+ id: touchdown; \n\
263+ objectName: "touchdown"; \n\
264+ anchors { %1 } \n\
265+ visible: root.pressed; \n\
266+ radius: "medium"; \n\
267+ borderSource: "radius_pressed.sci" \n\
268+ }\n';
269+
260270// %1 is used as anchors of subtitleLabel
261271// %2 is used as color of subtitleLabel
262272var kSubtitleLabelCode = 'Label { \n\
@@ -279,7 +289,7 @@ var kAttributesRowCode = 'CardAttributes { \n\
279289 objectName: "attributesRow"; \n\
280290 anchors { %1 } \n\
281291 color: %2; \n\
282− model: cardData && cardData["attributes"] || undefined; \n\
292+ model: cardData["attributes"]; \n\
283293 }\n';
284294
285295// %1 is used as top anchor of summary
@@ -569,6 +579,16 @@ function cardString(template, components) {
569579 code += kSummaryLabelCode.arg(summaryTopAnchor).arg(summaryTopMargin).arg(color);
570580 }
571581
582+ var touchdownAnchors;
583+ if (hasBackground) {
584+ touchdownAnchors = 'fill: backgroundLoader';
585+ } else if (hasArt && !hasMascot && !hasSummary) {
586+ touchdownAnchors = 'fill: artShapeHolder';
587+ } else {
588+ touchdownAnchors = 'fill: root'
589+ }
590+ code += kTouchdownCode.arg(touchdownAnchors);
591+
572592 if (hasSummary) {
573593 code += 'implicitHeight: summary.y + summary.height + (summary.text ? units.gu(1) : 0);\n';
574594 } else if (hasHeaderRow) {
tests/plugins/Dash/cardcreator/1.res+8
@@ -84,5 +84,13 @@ leftMargin: units.gu(1);
8484 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
8585 horizontalAlignment: root.headerAlignment;
8686 }
87+UbuntuShape {
88+ id: touchdown;
89+ objectName: "touchdown";
90+ anchors { fill: artShapeHolder }
91+ visible: root.pressed;
92+ radius: "medium";
93+ borderSource: "radius_pressed.sci"
94+}
8795implicitHeight: titleLabel.y + titleLabel.height + units.gu(1);
8896}
tests/plugins/Dash/cardcreator/2.res+8
@@ -116,5 +116,13 @@ left: parent.left;
116116
117117 ]
118118 }
119+UbuntuShape {
120+ id: touchdown;
121+ objectName: "touchdown";
122+ anchors { fill: backgroundLoader }
123+ visible: root.pressed;
124+ radius: "medium";
125+ borderSource: "radius_pressed.sci"
126+}
119127implicitHeight: row.y + row.height + units.gu(1);
120128}
tests/plugins/Dash/cardcreator/3.res+8
@@ -103,5 +103,13 @@ Label {
103103 font.weight: Font.Light;
104104 horizontalAlignment: root.headerAlignment;
105105 }
106+UbuntuShape {
107+ id: touchdown;
108+ objectName: "touchdown";
109+ anchors { fill: artShapeHolder }
110+ visible: root.pressed;
111+ radius: "medium";
112+ borderSource: "radius_pressed.sci"
113+}
106114implicitHeight: subtitleLabel.y + subtitleLabel.height + units.gu(1);
107115}
tests/plugins/Dash/cardcreator/4.res+8
@@ -94,5 +94,13 @@ Label {
9494}
9595]
9696}
97+UbuntuShape {
98+ id: touchdown;
99+ objectName: "touchdown";
100+ anchors { fill: root }
101+ visible: root.pressed;
102+ radius: "medium";
103+ borderSource: "radius_pressed.sci"
104+}
97105implicitHeight: row.y + row.height + units.gu(1);
98106}
tests/plugins/Dash/cardcreator/5.res+8
@@ -143,5 +143,13 @@ Label {
143143 font.weight: Font.Light;
144144 horizontalAlignment: root.headerAlignment;
145145 }
146+UbuntuShape {
147+ id: touchdown;
148+ objectName: "touchdown";
149+ anchors { fill: artShapeHolder }
150+ visible: root.pressed;
151+ radius: "medium";
152+ borderSource: "radius_pressed.sci"
153+}
146154implicitHeight: subtitleLabel.y + subtitleLabel.height + units.gu(1);
147155}
tests/plugins/Dash/cardcreator/6.res+8
@@ -63,5 +63,13 @@ Item {
6363 }
6464 }
6565readonly property int headerHeight: 0;
66+UbuntuShape {
67+ id: touchdown;
68+ objectName: "touchdown";
69+ anchors { fill: artShapeHolder }
70+ visible: root.pressed;
71+ radius: "medium";
72+ borderSource: "radius_pressed.sci"
73+}
6674implicitHeight: artShapeHolder.height;
6775}
tests/plugins/Dash/cardcreator/7.res+9−1
@@ -116,7 +116,7 @@ CardAttributes {
116116 objectName: "attributesRow";
117117 anchors { left: parent.left; right: parent.right }
118118 color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < 0.7 ? "white" : (root.scopeStyle ? root.scopeStyle.foreground : "grey");
119− model: cardData["attributes"]
119+ model: cardData["attributes"];
120120 }
121121
122122 ]
@@ -124,5 +124,13 @@ CardAttributes {
124124
125125 ]
126126 }
127+UbuntuShape {
128+ id: touchdown;
129+ objectName: "touchdown";
130+ anchors { fill: backgroundLoader }
131+ visible: root.pressed;
132+ radius: "medium";
133+ borderSource: "radius_pressed.sci"
134+}
127135implicitHeight: row.y + row.height + units.gu(1);
128136}
tests/plugins/Dash/cardcreatortest.cpp+13−4
@@ -19,6 +19,7 @@
1919#include <QQuickItem>
2020#include <QQuickView>
2121#include <QtTestGui>
22+#include <QDebug>
2223#include <QTemporaryFile>
2324
2425class CardCreatorTest : public QObject
@@ -74,15 +75,23 @@ private Q_SLOTS:
7475 QFile testResultFile(testDirPath + resultFileName);
7576 QVERIFY(testResultFile.open(QIODevice::ReadOnly));
7677 QTextStream ts2(&testResultFile);
77− const QString expectedResult = ts2.readAll();
78− const QString executedResult = cardStringResult.toString();
78+
7979 // Record failed results to /tmp
80+ const QString executedResult = cardStringResult.toString();
8081 QTemporaryFile tmpFile(QDir::tempPath() + QDir::separator() + "testCardCreatorFailedResultXXXXXX");
8182 tmpFile.open();
8283 tmpFile.setAutoRemove(false);
8384 tmpFile.write(executedResult.toUtf8().constData());
84− QCOMPARE(executedResult.simplified(), expectedResult.simplified());
85− tmpFile.setAutoRemove(true); // Remove the result if it passed
85+
86+ // Line by line comparison
87+ const QStringList expectedLines = ts2.readAll().trimmed().replace(QRegExp("\n\\s*\n"),"\n").split("\n");
88+ const QStringList cardStringResultLines = cardStringResult.toString().trimmed().replace(QRegExp("\n\\s*\n"),"\n").split("\n");
89+ for (int i = 0; i < expectedLines.size(); ++i) {
90+ QCOMPARE(cardStringResultLines[i].simplified(), expectedLines[i].simplified());
91+ }
92+
93+ // Remove the result if it passed
94+ tmpFile.setAutoRemove(true);
8695
8796 QVariant createCardComponentResult;
8897 QMetaObject::invokeMethod(view->rootObject(), "createCardComponent", Q_RETURN_ARG(QVariant, createCardComponentResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON));
tests/qmltests/Dash/tst_Card.qml+12
@@ -475,5 +475,17 @@ Rectangle {
475475 compare(shape !== null, data.shape);
476476 tryCompare(mascotImage, "visible", !data.shape);
477477 }
478+
479+ function test_touchdown_visibility() {
480+ selector.selectedIndex = 0;
481+
482+ var touchdown = findChild(card, "touchdown");
483+
484+ compare(touchdown.visible, false);
485+ mousePress(card, card.width/2, card.height/2);
486+ compare(touchdown.visible, true);
487+ mouseRelease(card, card.width/2, card.height/2);
488+ compare(touchdown.visible, false);
489+ }
478490 }
479491}