git.iko.soy/unity8
on xenial help sign in
Merge lp:~unity-team/unity8/themeing-font-and-mascot
bbe0049Michał Sawicz
qml/Dash/Card.qml+3−11
compare with xenial
unifiedsplit
@@ -44,6 +44,8 @@ AbstractButton {
44 anchors.fill: parent
44 anchors.fill: parent
45 image: backgroundImage.source ? backgroundImage : null
45 image: backgroundImage.source ? backgroundImage : null
46
46
47+ property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b
48+
47 property Image backgroundImage: Image {
49 property Image backgroundImage: Image {
48 objectName: "backgroundImage"
50 objectName: "backgroundImage"
49 source: {
51 source: {
@@ -187,17 +189,7 @@ AbstractButton {
187 text: cardData && cardData["summary"] || ""
189 text: cardData && cardData["summary"] || ""
188 height: text ? implicitHeight : 0
190 height: text ? implicitHeight : 0
189 fontSize: "small"
191 fontSize: "small"
190− color: getFontColor(background.color)
191−
192− function getLuminance(color) {
193− return 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;
194− }
195−
196 // TODO karni: Change "grey" to Ubuntu.Components.Palette color once updated.
192 // TODO karni: Change "grey" to Ubuntu.Components.Palette color once updated.
197− function getFontColor(backgroundColor) {
198− if (backgroundColor === undefined) return "grey";
199− var luminance = getLuminance(backgroundColor);
200− return luminance < 0.7 ? "white" : "grey"
193+ color: background.visible && background.luminance < 0.7 ? "white" : "grey"
201− }
202 }
194 }
203}
195}
qml/Dash/CardHeader.qml+2−47
@@ -22,9 +22,6 @@ Item {
22 property alias mascot: mascotImage.source
22 property alias mascot: mascotImage.source
23 property alias title: titleLabel.text
23 property alias title: titleLabel.text
24 property alias subtitle: subtitleLabel.text
24 property alias subtitle: subtitleLabel.text
25− property alias price: priceLabel.text
26− property alias oldPrice: oldPriceLabel.text
27− property alias altPrice: altPriceLabel.text
28
25
29 property alias titleWeight: titleLabel.font.weight
26 property alias titleWeight: titleLabel.font.weight
30 property alias titleSize: titleLabel.fontSize
27 property alias titleSize: titleLabel.fontSize
@@ -38,7 +35,7 @@ Item {
38 property bool useMascotShape: true
35 property bool useMascotShape: true
39 property color fontColor: "grey"
36 property color fontColor: "grey"
40
37
41− visible: mascotImage.status === Image.Ready || title || price
38+ visible: mascotImage.status === Image.Ready || title
42 height: row.height > 0 ? row.height + row.margins * 2 : 0
39 height: row.height > 0 ? row.height + row.margins * 2 : 0
43
40
44 Row {
41 Row {
@@ -71,6 +68,7 @@ Item {
71
68
72 Image {
69 Image {
73 id: mascotImage
70 id: mascotImage
71+ objectName: "mascotImage"
74
72
75 width: source ? mascotShape.width : 0
73 width: source ? mascotShape.width : 0
76 height: mascotShape.height
74 height: mascotShape.height
@@ -113,49 +111,6 @@ Item {
113 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale)
111 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale)
114 color: fontColor
112 color: fontColor
115 }
113 }
116−
117− Row {
118− id: prices
119− objectName: "prices"
120− anchors { left: parent.left; right: parent.right }
121−
122− property int labels: {
123− var labels = 1; // price always visible
124− if (oldPriceLabel.text !== "") labels += 1;
125− if (altPriceLabel.text !== "") labels += 1;
126− return labels;
127− }
128− property real labelWidth: width / labels
129−
130− Label {
131− id: priceLabel
132− width: parent.labelWidth
133− elide: Text.ElideRight
134− font.weight: Font.DemiBold
135− color: "#ff990000"
136− visible: text
137− }
138−
139− Label {
140− id: oldPriceLabel
141− objectName: "oldPriceLabel"
142− width: parent.labelWidth
143− elide: Text.ElideRight
144− horizontalAlignment: parent.labels === 3 ? Text.AlignHCenter : Text.AlignRight
145− font.strikeout: true
146− color: "black"
147− visible: text
148− }
149−
150− Label {
151− id: altPriceLabel
152− width: parent.labelWidth
153− elide: Text.ElideRight
154− horizontalAlignment: Text.AlignRight
155− color: fontColor
156− visible: text
157− }
158− }
159 }
114 }
160 }
115 }
161}
116}
tests/qmltests/Dash/tst_Card.qml+49
@@ -427,5 +427,54 @@ Rectangle {
427
427
428 tryCompare(testCase.title.font, "weight", data.weight);
428 tryCompare(testCase.title.font, "weight", data.weight);
429 }
429 }
430+
431+ function test_fontColor_data() {
432+ return [
433+ { tag: "#ffffff", dark: true },
434+ { tag: "#fdfdfd", dark: true },
435+ { tag: "#f9f9f9", dark: true },
436+ { tag: "#000000", dark: false },
437+ { tag: "#ef814c", dark: false },
438+ { tag: "#312f2c", dark: false },
439+ { tag: "#be332d", dark: false },
440+ { tag: "#52ace4", dark: false },
441+ { tag: "#3a5897", dark: false },
442+ { tag: "#1caeeb", dark: false },
443+ { tag: "#87c341", dark: false },
444+ { tag: "#50893b", dark: false },
445+ ];
446+ }
447+
448+ function test_fontColor(data) {
449+ selector.selectedIndex = 10;
450+
451+ background.color = data.tag;
452+
453+ var fontColor = data.dark ? "grey" : "white";
454+
455+ tryCompareFunction(function() { return Qt.colorEqual(summary.color, fontColor); }, true);
456+ tryCompareFunction(function() { return Qt.colorEqual(header.fontColor, fontColor); }, true);
457+ }
458+
459+ function test_mascotShape_data() {
460+ return [
461+ { tag: "Art and summary", shape: false, index: 0 },
462+ { tag: "No Summary", shape: true, index: 6 },
463+ { tag: "With background", shape: false, index: 10 },
464+ ];
465+ }
466+
467+ function test_mascotShape(data) {
468+ selector.selectedIndex = data.index;
469+
470+ var shape = findChild(card, "mascotShape");
471+ var image = findChild(card, "mascotImage");
472+
473+ verify(shape, "Could not find shape.");
474+ verify(image, "Could not find image.");
475+
476+ tryCompare(shape, "visible", data.shape);
477+ tryCompare(image, "visible", !data.shape);
478+ }
430 }
479 }
431}
480}
tests/qmltests/Dash/tst_CardHeader.qml−27
@@ -46,7 +46,6 @@ Rectangle {
46 property Item mascot: findChild(cardHeader, "mascotShape")
46 property Item mascot: findChild(cardHeader, "mascotShape")
47 property Item titleLabel: findChild(cardHeader, "titleLabel")
47 property Item titleLabel: findChild(cardHeader, "titleLabel")
48 property Item subtitleLabel: findChild(cardHeader, "subtitleLabel")
48 property Item subtitleLabel: findChild(cardHeader, "subtitleLabel")
49− property Item prices: findChild(cardHeader, "prices")
50 property Item oldPriceLabel: findChild(cardHeader, "oldPriceLabel")
49 property Item oldPriceLabel: findChild(cardHeader, "oldPriceLabel")
51 property Item outerRow: findChild(cardHeader, "outerRow")
50 property Item outerRow: findChild(cardHeader, "outerRow")
52 property Item column: findChild(cardHeader, "column")
51 property Item column: findChild(cardHeader, "column")
@@ -55,7 +54,6 @@ Rectangle {
55 verify(typeof testCase.mascot === "object", "Couldn't find mascot object.");
54 verify(typeof testCase.mascot === "object", "Couldn't find mascot object.");
56 verify(typeof testCase.titleLabel === "object", "Couldn't find titleLabel object.");
55 verify(typeof testCase.titleLabel === "object", "Couldn't find titleLabel object.");
57 verify(typeof testCase.subtitleLabel === "object", "Couldn't find subtitleLabel object.");
56 verify(typeof testCase.subtitleLabel === "object", "Couldn't find subtitleLabel object.");
58− verify(typeof testCase.prices === "object", "Couldn't find prices object.");
59 verify(typeof testCase.oldPriceLabel === "object", "Couldn't find oldPriceLabel object.");
57 verify(typeof testCase.oldPriceLabel === "object", "Couldn't find oldPriceLabel object.");
60 }
58 }
61
59
@@ -63,9 +61,6 @@ Rectangle {
63 cardHeader.mascot = "";
61 cardHeader.mascot = "";
64 cardHeader.title = "";
62 cardHeader.title = "";
65 cardHeader.subtitle = "";
63 cardHeader.subtitle = "";
66− cardHeader.price = "";
67− cardHeader.oldPrice = "";
68− cardHeader.altPrice = "";
69 }
64 }
70
65
71 function test_mascot_data() {
66 function test_mascot_data() {
@@ -96,28 +91,6 @@ Rectangle {
96 tryCompare(cardHeader, "visible", data.visible);
91 tryCompare(cardHeader, "visible", data.visible);
97 }
92 }
98
93
99− function test_prices_data() {
100− return [
101− { tag: "Main", main: "$1.25", visible: true },
102− { tag: "Alt", alt: "€1.00", visible: false },
103− { tag: "Old", old: "€2.00", visible: false },
104− { tag: "Main and Alt", main: "$1.25", alt: "€1.00", visible: true },
105− { tag: "Main and Old", main: "$1.25", old: "$2.00", visible: true, oldAlign: Text.AlignRight },
106− { tag: "Alt and Old", alt: "€1.00", old: "$2.00", visible: false },
107− { tag: "All", main: "$1.25", alt: "€1.00", old: "$2.00", visible: true, oldAlign: Text.AlignHCenter },
108− ]
109− }
110−
111− function test_prices(data) {
112− cardHeader.price = data.main !== undefined ? data.main : "";
113− cardHeader.oldPrice = data.old !== undefined ? data.old : "";
114− cardHeader.altPrice = data.alt !== undefined ? data.alt : "";
115− tryCompare(cardHeader, "visible", data.visible);
116− if (data.hasOwnProperty("oldAlign")) {
117− compare(testCase.oldPriceLabel.horizontalAlignment, data.oldAlign, "Old price label is aligned wrong.")
118− }
119− }
120−
121 function test_dimensions_data() {
94 function test_dimensions_data() {
122 return [
95 return [
123 { tag: "Column width", object: column, width: cardHeader.width },
96 { tag: "Column width", object: column, width: cardHeader.width },