git.iko.soy/unity8
on xenial help sign in
Tweak card header to implement the spec correctly
bd181fcMichał Sawicz
plugins/Dash/CardAttributes.qml+1−1
compare with xenial
unifiedsplit
@@ -59,7 +59,7 @@ GridLayout {
59 text: "value" in modelData && modelData["value"] || "";
59 text: "value" in modelData && modelData["value"] || "";
60 elide: Text.ElideRight
60 elide: Text.ElideRight
61 maximumLineCount: 1
61 maximumLineCount: 1
62− font.weight: "style" in modelData && modelData["style"] == "highlighted" ? Font.DemiBold : Font.Light
62+ font.weight: "style" in modelData && modelData["style"] === "highlighted" ? Font.Bold : Font.Light
63 fontSize: "small"
63 fontSize: "small"
64 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale)
64 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale)
65 color: grid.color
65 color: grid.color
plugins/Dash/CardCreator.js+7−8
@@ -215,18 +215,18 @@ var kTitleLabelCode = 'Label { \n\
215 elide: Text.ElideRight; \n\
215 elide: Text.ElideRight; \n\
216 fontSize: "small"; \n\
216 fontSize: "small"; \n\
217 wrapMode: Text.Wrap; \n\
217 wrapMode: Text.Wrap; \n\
218− maximumLineCount: 2; \n\
218+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2; \n\
219 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
219 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
220 color: %2; \n\
220 color: %2; \n\
221 visible: showHeader %3; \n\
221 visible: showHeader %3; \n\
222 text: root.title; \n\
222 text: root.title; \n\
223− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal; \n\
223+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal; \n\
224− horizontalAlignment: root.headerAlignment; \n\
224+ horizontalAlignment: root.titleAlignment; \n\
225 }\n';
225 }\n';
226
226
227// %1 is used as extra anchors of emblemIcon
227// %1 is used as extra anchors of emblemIcon
228// %2 is used as color of emblemIcon
228// %2 is used as color of emblemIcon
229−var kEmblemIconCode = 'Icon { \n\
229+var kEmblemIconCode = 'StatusIcon { \n\
230 id: emblemIcon; \n\
230 id: emblemIcon; \n\
231 objectName: "emblemIcon"; \n\
231 objectName: "emblemIcon"; \n\
232 anchors { \n\
232 anchors { \n\
@@ -236,7 +236,6 @@ var kEmblemIconCode = 'Icon { \n\
236 } \n\
236 } \n\
237 source: cardData && cardData["emblem"] || ""; \n\
237 source: cardData && cardData["emblem"] || ""; \n\
238 color: %2; \n\
238 color: %2; \n\
239− width: height; \n\
240 height: source != "" ? titleLabel.font.pixelSize : 0; \n\
239 height: source != "" ? titleLabel.font.pixelSize : 0; \n\
241 }\n';
240 }\n';
242
241
@@ -258,13 +257,12 @@ var kSubtitleLabelCode = 'Label { \n\
258 anchors { %1 } \n\
257 anchors { %1 } \n\
259 anchors.topMargin: units.dp(2); \n\
258 anchors.topMargin: units.dp(2); \n\
260 elide: Text.ElideRight; \n\
259 elide: Text.ElideRight; \n\
261− fontSize: "small"; \n\
260+ fontSize: "x-small"; \n\
262 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
261 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
263 color: %2; \n\
262 color: %2; \n\
264 visible: titleLabel.visible && titleLabel.text; \n\
263 visible: titleLabel.visible && titleLabel.text; \n\
265 text: cardData && cardData["subtitle"] || ""; \n\
264 text: cardData && cardData["subtitle"] || ""; \n\
266 font.weight: Font.Light; \n\
265 font.weight: Font.Light; \n\
267− horizontalAlignment: root.headerAlignment; \n\
268 }\n';
266 }\n';
269
267
270// %1 is used as anchors of attributesRow
268// %1 is used as anchors of attributesRow
@@ -310,7 +308,7 @@ function cardString(template, components) {
310 property var artShapeBorderSource: undefined; \n\
308 property var artShapeBorderSource: undefined; \n\
311 property real fontScale: 1.0; \n\
309 property real fontScale: 1.0; \n\
312 property var scopeStyle: null; \n\
310 property var scopeStyle: null; \n\
313− property int headerAlignment: Text.AlignLeft; \n\
311+ property int titleAlignment: Text.AlignLeft; \n\
314 property int fixedHeaderHeight: -1; \n\
312 property int fixedHeaderHeight: -1; \n\
315 property size fixedArtShapeSize: Qt.size(-1, -1); \n\
313 property size fixedArtShapeSize: Qt.size(-1, -1); \n\
316 readonly property string title: cardData && cardData["title"] || ""; \n\
314 readonly property string title: cardData && cardData["title"] || ""; \n\
@@ -655,6 +653,7 @@ function cardString(template, components) {
655function createCardComponent(parent, template, components) {
653function createCardComponent(parent, template, components) {
656 var imports = 'import QtQuick 2.2; \n\
654 var imports = 'import QtQuick 2.2; \n\
657 import Ubuntu.Components 1.1; \n\
655 import Ubuntu.Components 1.1; \n\
656+ import Ubuntu.Settings.Components 0.1; \n\
658 import Dash 0.1;\n\
657 import Dash 0.1;\n\
659 import Utils 0.1;\n';
658 import Utils 0.1;\n';
660 var card = cardString(template, components);
659 var card = cardString(template, components);
qml/Dash/CardGrid.qml+1−1
@@ -68,7 +68,7 @@ DashRenderer {
68 item.cardData = Qt.binding(function() { return model; });
68 item.cardData = Qt.binding(function() { return model; });
69 item.template = Qt.binding(function() { return cardTool.template; });
69 item.template = Qt.binding(function() { return cardTool.template; });
70 item.components = Qt.binding(function() { return cardTool.components; });
70 item.components = Qt.binding(function() { return cardTool.components; });
71− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
71+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
72 item.scopeStyle = root.scopeStyle;
72 item.scopeStyle = root.scopeStyle;
73 }
73 }
74 Connections {
74 Connections {
qml/Dash/CardHorizontalList.qml+1−1
@@ -49,7 +49,7 @@ DashRenderer {
49 item.cardData = Qt.binding(function() { return model; });
49 item.cardData = Qt.binding(function() { return model; });
50 item.template = Qt.binding(function() { return cardTool.template; });
50 item.template = Qt.binding(function() { return cardTool.template; });
51 item.components = Qt.binding(function() { return cardTool.components; });
51 item.components = Qt.binding(function() { return cardTool.components; });
52− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
52+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
53 item.scopeStyle = root.scopeStyle;
53 item.scopeStyle = root.scopeStyle;
54 }
54 }
55 Connections {
55 Connections {
qml/Dash/CardTool.qml+11−11
@@ -131,21 +131,21 @@ Item {
131 property size artShapeSize: cardLoader.item ? cardLoader.item.artShapeSize : 0
131 property size artShapeSize: cardLoader.item ? cardLoader.item.artShapeSize : 0
132
132
133 /*!
133 /*!
134− \brief Desired alignment of header components.
134+ \brief Desired alignment of title
135 */
135 */
136− readonly property int headerAlignment: {
136+ readonly property int titleAlignment: {
137− var subtitle = components["subtitle"];
137+ if (template["card-layout"] === "horizontal"
138− var price = components["price"];
138+ || typeof components["title"] !== "object"
139− var summary = components["summary"];
139+ || components["title"]["align"] !== "center") return Text.AlignHCenter;
140
140
141− var hasSubtitle = subtitle && (typeof subtitle === "string" || subtitle["field"])
141+ var keys = ["mascot", "emblem", "subtitle", "attributes", "summary"];
142− var hasPrice = price && (typeof price === "string" || subtitle["field"]);
143− var hasSummary = summary && (typeof summary === "string" || summary["field"])
144
142
145− var isOnlyTextComponent = !hasSubtitle && !hasPrice && !hasSummary;
143+ for (var key in keys) {
144+ if (typeof components[key] === "string"
146− if (!isOnlyTextComponent) return Text.AlignLeft;
145+ || typeof components[key]["field"] === "string") return Text.AlignLeft;
146+ }
147
147
148− return (template["card-layout"] === "horizontal") ? Text.AlignLeft : Text.AlignHCenter;
148+ return Text.AlignHCenter;
149 }
149 }
150
150
151 QtObject {
151 QtObject {
qml/Dash/CardVerticalJournal.qml+1−1
@@ -56,7 +56,7 @@ DashRenderer {
56 item.cardData = Qt.binding(function() { return model; });
56 item.cardData = Qt.binding(function() { return model; });
57 item.template = Qt.binding(function() { return cardTool.template; });
57 item.template = Qt.binding(function() { return cardTool.template; });
58 item.components = Qt.binding(function() { return cardTool.components; });
58 item.components = Qt.binding(function() { return cardTool.components; });
59− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
59+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
60 item.scopeStyle = root.scopeStyle;
60 item.scopeStyle = root.scopeStyle;
61 }
61 }
62 Connections {
62 Connections {
qml/Dash/ScopesOverviewFavorites.qml+1−1
@@ -61,7 +61,7 @@ Flickable {
61 item.cardData = Qt.binding(function() { return model; });
61 item.cardData = Qt.binding(function() { return model; });
62 item.template = Qt.binding(function() { return cardTool.template; });
62 item.template = Qt.binding(function() { return cardTool.template; });
63 item.components = Qt.binding(function() { return cardTool.components; });
63 item.components = Qt.binding(function() { return cardTool.components; });
64− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
64+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
65 }
65 }
66
66
67 Connections {
67 Connections {
tests/plugins/Dash/cardcreator/1.res+4−4
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -68,13 +68,13 @@ Label {
68 elide: Text.ElideRight;
68 elide: Text.ElideRight;
69 fontSize: "small";
69 fontSize: "small";
70 wrapMode: Text.Wrap;
70 wrapMode: Text.Wrap;
71− maximumLineCount: 2;
71+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
73 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
73 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
74 visible: showHeader ;
74 visible: showHeader ;
75 text: root.title;
75 text: root.title;
76− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
76+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
77− horizontalAlignment: root.headerAlignment;
77+ horizontalAlignment: root.titleAlignment;
78 }
78 }
79UbuntuShape {
79UbuntuShape {
80 id: touchdown;
80 id: touchdown;
tests/plugins/Dash/cardcreator/2.res+5−6
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -92,13 +92,13 @@ Image {
92 elide: Text.ElideRight;
92 elide: Text.ElideRight;
93 fontSize: "small";
93 fontSize: "small";
94 wrapMode: Text.Wrap;
94 wrapMode: Text.Wrap;
95− maximumLineCount: 2;
95+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
96 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
96 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
97 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
97 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
98 visible: showHeader ;
98 visible: showHeader ;
99 text: root.title;
99 text: root.title;
100− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
100+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
101− horizontalAlignment: root.headerAlignment;
101+ horizontalAlignment: root.titleAlignment;
102 }
102 }
103 ,Label {
103 ,Label {
104 id: subtitleLabel;
104 id: subtitleLabel;
@@ -110,13 +110,12 @@ Image {
110 }
110 }
111 anchors.topMargin: units.dp(2);
111 anchors.topMargin: units.dp(2);
112 elide: Text.ElideRight;
112 elide: Text.ElideRight;
113− fontSize: "small";
113+ fontSize: "x-small";
114 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
114 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
115 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
115 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
116 visible: titleLabel.visible && titleLabel.text;
116 visible: titleLabel.visible && titleLabel.text;
117 text: cardData && cardData["subtitle"] || "";
117 text: cardData && cardData["subtitle"] || "";
118 font.weight: Font.Light;
118 font.weight: Font.Light;
119− horizontalAlignment: root.headerAlignment;
120 }
119 }
121
120
122 ]
121 ]
tests/plugins/Dash/cardcreator/3.res+5−6
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -68,13 +68,13 @@ Label {
68 elide: Text.ElideRight;
68 elide: Text.ElideRight;
69 fontSize: "small";
69 fontSize: "small";
70 wrapMode: Text.Wrap;
70 wrapMode: Text.Wrap;
71− maximumLineCount: 2;
71+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
73 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
73 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
74 visible: showHeader ;
74 visible: showHeader ;
75 text: root.title;
75 text: root.title;
76− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
76+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
77− horizontalAlignment: root.headerAlignment;
77+ horizontalAlignment: root.titleAlignment;
78 }
78 }
79Label {
79Label {
80 id: subtitleLabel;
80 id: subtitleLabel;
@@ -86,13 +86,12 @@ Label {
86 }
86 }
87 anchors.topMargin: units.dp(2);
87 anchors.topMargin: units.dp(2);
88 elide: Text.ElideRight;
88 elide: Text.ElideRight;
89− fontSize: "small";
89+ fontSize: "x-small";
90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
91 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
91 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
92 visible: titleLabel.visible && titleLabel.text;
92 visible: titleLabel.visible && titleLabel.text;
93 text: cardData && cardData["subtitle"] || "";
93 text: cardData && cardData["subtitle"] || "";
94 font.weight: Font.Light;
94 font.weight: Font.Light;
95− horizontalAlignment: root.headerAlignment;
96 }
95 }
97UbuntuShape {
96UbuntuShape {
98 id: touchdown;
97 id: touchdown;
tests/plugins/Dash/cardcreator/4.res+5−6
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -72,13 +72,13 @@ Label {
72 elide: Text.ElideRight;
72 elide: Text.ElideRight;
73 fontSize: "small";
73 fontSize: "small";
74 wrapMode: Text.Wrap;
74 wrapMode: Text.Wrap;
75− maximumLineCount: 2;
75+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
76 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
76 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
77 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
77 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
78 visible: showHeader ;
78 visible: showHeader ;
79 text: root.title;
79 text: root.title;
80− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
80+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
81− horizontalAlignment: root.headerAlignment;
81+ horizontalAlignment: root.titleAlignment;
82 }
82 }
83,Label {
83,Label {
84 id: subtitleLabel;
84 id: subtitleLabel;
@@ -90,13 +90,12 @@ Label {
90 }
90 }
91 anchors.topMargin: units.dp(2);
91 anchors.topMargin: units.dp(2);
92 elide: Text.ElideRight;
92 elide: Text.ElideRight;
93− fontSize: "small";
93+ fontSize: "x-small";
94 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
94 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
95 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
95 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
96 visible: titleLabel.visible && titleLabel.text;
96 visible: titleLabel.visible && titleLabel.text;
97 text: cardData && cardData["subtitle"] || "";
97 text: cardData && cardData["subtitle"] || "";
98 font.weight: Font.Light;
98 font.weight: Font.Light;
99− horizontalAlignment: root.headerAlignment;
100 }
99 }
101]
100]
102}
101}
tests/plugins/Dash/cardcreator/5.res+5−6
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -112,13 +112,13 @@ Label {
112 elide: Text.ElideRight;
112 elide: Text.ElideRight;
113 fontSize: "small";
113 fontSize: "small";
114 wrapMode: Text.Wrap;
114 wrapMode: Text.Wrap;
115− maximumLineCount: 2;
115+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
116 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
116 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
117 color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
117 color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
118 visible: showHeader && overlayLoader.active;
118 visible: showHeader && overlayLoader.active;
119 text: root.title;
119 text: root.title;
120− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
120+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
121− horizontalAlignment: root.headerAlignment;
121+ horizontalAlignment: root.titleAlignment;
122 }
122 }
123Label {
123Label {
124 id: subtitleLabel;
124 id: subtitleLabel;
@@ -131,13 +131,12 @@ Label {
131 }
131 }
132 anchors.topMargin: units.dp(2);
132 anchors.topMargin: units.dp(2);
133 elide: Text.ElideRight;
133 elide: Text.ElideRight;
134− fontSize: "small";
134+ fontSize: "x-small";
135 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
135 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
136 color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
136 color: root.scopeStyle ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
137 visible: titleLabel.visible && titleLabel.text;
137 visible: titleLabel.visible && titleLabel.text;
138 text: cardData && cardData["subtitle"] || "";
138 text: cardData && cardData["subtitle"] || "";
139 font.weight: Font.Light;
139 font.weight: Font.Light;
140− horizontalAlignment: root.headerAlignment;
141 }
140 }
142UbuntuShape {
141UbuntuShape {
143 id: touchdown;
142 id: touchdown;
tests/plugins/Dash/cardcreator/6.res+6−8
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -68,13 +68,13 @@ Item {
68 elide: Text.ElideRight;
68 elide: Text.ElideRight;
69 fontSize: "small";
69 fontSize: "small";
70 wrapMode: Text.Wrap;
70 wrapMode: Text.Wrap;
71− maximumLineCount: 2;
71+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
72 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
73 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
73 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
74 visible: showHeader ;
74 visible: showHeader ;
75 text: root.title;
75 text: root.title;
76− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
76+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
77− horizontalAlignment: root.headerAlignment;
77+ horizontalAlignment: root.titleAlignment;
78 }
78 }
79,Label {
79,Label {
80 id: subtitleLabel;
80 id: subtitleLabel;
@@ -86,15 +86,14 @@ Item {
86 }
86 }
87 anchors.topMargin: units.dp(2);
87 anchors.topMargin: units.dp(2);
88 elide: Text.ElideRight;
88 elide: Text.ElideRight;
89− fontSize: "small";
89+ fontSize: "x-small";
90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
90 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
91 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
91 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
92 visible: titleLabel.visible && titleLabel.text;
92 visible: titleLabel.visible && titleLabel.text;
93 text: cardData && cardData["subtitle"] || "";
93 text: cardData && cardData["subtitle"] || "";
94 font.weight: Font.Light;
94 font.weight: Font.Light;
95− horizontalAlignment: root.headerAlignment;
96 }
95 }
97−,Icon {
96+,StatusIcon {
98 id: emblemIcon;
97 id: emblemIcon;
99 objectName: "emblemIcon";
98 objectName: "emblemIcon";
100 anchors {
99 anchors {
@@ -104,7 +103,6 @@ Item {
104 }
103 }
105 source: cardData && cardData["emblem"] || "";
104 source: cardData && cardData["emblem"] || "";
106 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
105 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
107− width: height;
108 height: source != "" ? titleLabel.font.pixelSize : 0;
106 height: source != "" ? titleLabel.font.pixelSize : 0;
109 }
107 }
110
108
tests/plugins/Dash/cardcreator/7.res+5−6
@@ -6,7 +6,7 @@ AbstractButton {
6 property var artShapeBorderSource: undefined;
6 property var artShapeBorderSource: undefined;
7 property real fontScale: 1.0;
7 property real fontScale: 1.0;
8 property var scopeStyle: null;
8 property var scopeStyle: null;
9− property int headerAlignment: Text.AlignLeft;
9+ property int titleAlignment: Text.AlignLeft;
10 property int fixedHeaderHeight: -1;
10 property int fixedHeaderHeight: -1;
11 property size fixedArtShapeSize: Qt.size(-1, -1);
11 property size fixedArtShapeSize: Qt.size(-1, -1);
12 readonly property string title: cardData && cardData["title"] || "";
12 readonly property string title: cardData && cardData["title"] || "";
@@ -93,13 +93,13 @@ Image {
93 elide: Text.ElideRight;
93 elide: Text.ElideRight;
94 fontSize: "small";
94 fontSize: "small";
95 wrapMode: Text.Wrap;
95 wrapMode: Text.Wrap;
96− maximumLineCount: 2;
96+ maximumLineCount: horizontalAlignment === Text.AlighHCenter ? 1 : 2;
97 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
97 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
98 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
98 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
99 visible: showHeader ;
99 visible: showHeader ;
100 text: root.title;
100 text: root.title;
101− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
101+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
102− horizontalAlignment: root.headerAlignment;
102+ horizontalAlignment: root.titleAlignment;
103 }
103 }
104,Label {
104,Label {
105 id: subtitleLabel;
105 id: subtitleLabel;
@@ -111,13 +111,12 @@ Image {
111 }
111 }
112 anchors.topMargin: units.dp(2);
112 anchors.topMargin: units.dp(2);
113 elide: Text.ElideRight;
113 elide: Text.ElideRight;
114− fontSize: "small";
114+ fontSize: "x-small";
115 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
115 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
116 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
116 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
117 visible: titleLabel.visible && titleLabel.text;
117 visible: titleLabel.visible && titleLabel.text;
118 text: cardData && cardData["subtitle"] || "";
118 text: cardData && cardData["subtitle"] || "";
119 font.weight: Font.Light;
119 font.weight: Font.Light;
120− horizontalAlignment: root.headerAlignment;
121 }
120 }
122,CardAttributes {
121,CardAttributes {
123 id: attributesRow;
122 id: attributesRow;
tests/qmltests/Dash/tst_CardTool.qml+19−17
@@ -73,8 +73,8 @@ Rectangle {
73 "layout": { "components": Helpers.update(JSON.parse(Helpers.fullMapping), { "art": {"aspect-ratio": 0.5, "summary": undefined }}) }
73 "layout": { "components": Helpers.update(JSON.parse(Helpers.fullMapping), { "art": {"aspect-ratio": 0.5, "summary": undefined }}) }
74 },
74 },
75 {
75 {
76− "name": "Title - vertical",
76+ "name": "Title - centered",
77− "layout": { "template": { "card-layout": "vertical" }, "components": { "title": "title" } }
77+ "layout": { "template": { "card-layout": "vertical" }, "components": { "title": { "field": "title", "align": "center" } } }
78 },
78 },
79 {
79 {
80 "name": "Title - horizontal",
80 "name": "Title - horizontal",
@@ -85,8 +85,12 @@ Rectangle {
85 "layout": { "template": { "card-layout": "vertical" }, "components": { "title": "title", "subtitle": "subtitle" } }
85 "layout": { "template": { "card-layout": "vertical" }, "components": { "title": "title", "subtitle": "subtitle" } }
86 },
86 },
87 {
87 {
88− "name": "Title, price - horizontal",
88+ "name": "Title, attributes - horizontal",
89− "layout": { "template": { "card-layout": "horizontal" }, "components": { "title": "title", "price": "price" } }
89+ "layout": { "template": { "card-layout": "horizontal" }, "components": { "title": "title", "attributes": "attributes" } }
90+ },
91+ {
92+ "name": "Title, attributes - centered",
93+ "layout": { "template": { "card-layout": "vertical" }, "components": { "title": "title", "attributes": "attributes" } }
90 },
94 },
91 ]
95 ]
92
96
@@ -100,6 +104,7 @@ Rectangle {
100 }
104 }
101
105
102 Column {
106 Column {
107+ id: column
103 width: units.gu(38)
108 width: units.gu(38)
104 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
109 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
105
110
@@ -111,7 +116,7 @@ Rectangle {
111 ]
116 ]
112
117
113 delegate: Row {
118 delegate: Row {
114− anchors { left: parent.left; right: parent.right; margins: units.gu(3) }
119+ anchors { left: column.left; right: column.right; margins: units.gu(3) }
115
120
116 Label {
121 Label {
117 height: units.gu(5)
122 height: units.gu(5)
@@ -315,27 +320,24 @@ Rectangle {
315 }
320 }
316 }
321 }
317
322
318− function test_card_header_component_alignment_data() {
323+ function test_card_title_alignment_data() {
319 return [
324 return [
320− { tag: "Title - vertical", component: "titleLabel", property: "headerAlignment",
321− value: Text.AlignHCenter, index: 11, layout_index: 0 },
325+ { tag: "Title - centered", value: Text.AlignHCenter, index: 11, layout_index: 0 },
322− { tag: "Title - horizontal", component: "titleLabel", property: "headerAlignment",
323− value: Text.AlignLeft, index: 12, layout_index: 0},
326+ { tag: "Title - horizontal", value: Text.AlignLeft, index: 12, layout_index: 0},
324− { tag: "Title, subtitle - vertical", component: "titleLabel", property: "headerAlignment",
325− value: Text.AlignLeft, index: 13, layout_index: 0},
327+ { tag: "Title, subtitle - vertical", value: Text.AlignLeft, index: 13, layout_index: 0},
326− { tag: "Title, price - horizontal", component: "titleLabel", property: "headerAlignment",
327− value: Text.AlignLeft, index: 14, layout_index: 0},
328+ { tag: "Title, attribute - horizontal", value: Text.AlignLeft, index: 14, layout_index: 0},
329+ { tag: "Title, attribute - centered", value: Text.AlignLeft, index: 15, layout_index: 0},
328− ]
330+ ];
329 }
331 }
330
332
331− function test_card_header_component_alignment(data) {
333+ function test_card_title_alignment(data) {
332 selector.selectedIndex = data.index;
334 selector.selectedIndex = data.index;
333 if (data.hasOwnProperty("layout_index")) {
335 if (data.hasOwnProperty("layout_index")) {
334 layoutSelector.selectedIndex = data.layout_index;
336 layoutSelector.selectedIndex = data.layout_index;
335 }
337 }
336
338
337 if (data.hasOwnProperty("property")) {
339 if (data.hasOwnProperty("property")) {
338− tryCompare(cardTool, data.property, data.value);
340+ tryCompare(cardTool, "titleAlignment", data.value);
339 }
341 }
340 }
342 }
341
343