on xenial help sign in
Tweak card header to match the spec
8e74cddMichał Sawicz
plugins/Dash/CardAttributes.qml+1−1
@@ -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+6−7
@@ -222,13 +222,13 @@ var kTitleLabelCode = 'Label { \n\
222 color: %2; \n\
222 color: %2; \n\
223 visible: showHeader %3; \n\
223 visible: showHeader %3; \n\
224 text: root.title; \n\
224 text: root.title; \n\
225− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal; \n\
225+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal; \n\
226− horizontalAlignment: root.headerAlignment; \n\
226+ horizontalAlignment: root.titleAlignment; \n\
227 }\n';
227 }\n';
228
228
229// %1 is used as extra anchors of emblemIcon
229// %1 is used as extra anchors of emblemIcon
230// %2 is used as color of emblemIcon
230// %2 is used as color of emblemIcon
231−var kEmblemIconCode = 'Icon { \n\
231+var kEmblemIconCode = 'StatusIcon { \n\
232 id: emblemIcon; \n\
232 id: emblemIcon; \n\
233 objectName: "emblemIcon"; \n\
233 objectName: "emblemIcon"; \n\
234 anchors { \n\
234 anchors { \n\
@@ -238,7 +238,6 @@ var kEmblemIconCode = 'Icon { \n\
238 } \n\
238 } \n\
239 source: cardData && cardData["emblem"] || ""; \n\
239 source: cardData && cardData["emblem"] || ""; \n\
240 color: %2; \n\
240 color: %2; \n\
241− width: height; \n\
242 height: source != "" ? titleLabel.font.pixelSize : 0; \n\
241 height: source != "" ? titleLabel.font.pixelSize : 0; \n\
243 }\n';
242 }\n';
244
243
@@ -260,13 +259,12 @@ var kSubtitleLabelCode = 'Label { \n\
260 anchors { %1 } \n\
259 anchors { %1 } \n\
261 anchors.topMargin: units.dp(2); \n\
260 anchors.topMargin: units.dp(2); \n\
262 elide: Text.ElideRight; \n\
261 elide: Text.ElideRight; \n\
263− fontSize: "small"; \n\
262+ fontSize: "x-small"; \n\
264 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
263 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \n\
265 color: %2; \n\
264 color: %2; \n\
266 visible: titleLabel.visible && titleLabel.text; \n\
265 visible: titleLabel.visible && titleLabel.text; \n\
267 text: cardData && cardData["subtitle"] || ""; \n\
266 text: cardData && cardData["subtitle"] || ""; \n\
268 font.weight: Font.Light; \n\
267 font.weight: Font.Light; \n\
269− horizontalAlignment: root.headerAlignment; \n\
270 }\n';
268 }\n';
271
269
272// %1 is used as anchors of attributesRow
270// %1 is used as anchors of attributesRow
@@ -312,7 +310,7 @@ function cardString(template, components) {
312 property var artShapeBorderSource: undefined; \n\
310 property var artShapeBorderSource: undefined; \n\
313 property real fontScale: 1.0; \n\
311 property real fontScale: 1.0; \n\
314 property var scopeStyle: null; \n\
312 property var scopeStyle: null; \n\
315− property int headerAlignment: Text.AlignLeft; \n\
313+ property int titleAlignment: Text.AlignLeft; \n\
316 property int fixedHeaderHeight: -1; \n\
314 property int fixedHeaderHeight: -1; \n\
317 property size fixedArtShapeSize: Qt.size(-1, -1); \n\
315 property size fixedArtShapeSize: Qt.size(-1, -1); \n\
318 readonly property string title: cardData && cardData["title"] || ""; \n\
316 readonly property string title: cardData && cardData["title"] || ""; \n\
@@ -657,6 +655,7 @@ function cardString(template, components) {
657function createCardComponent(parent, template, components) {
655function createCardComponent(parent, template, components) {
658 var imports = 'import QtQuick 2.2; \n\
656 var imports = 'import QtQuick 2.2; \n\
659 import Ubuntu.Components 1.1; \n\
657 import Ubuntu.Components 1.1; \n\
658+ import Ubuntu.Settings.Components 0.1; \n\
660 import Ubuntu.Connectivity 1.0; \n\
659 import Ubuntu.Connectivity 1.0; \n\
661 import Dash 0.1;\n\
660 import Dash 0.1;\n\
662 import Utils 0.1;\n';
661 import Utils 0.1;\n';
qml/Dash/CardGrid.qml+1−1
@@ -69,7 +69,7 @@ DashRenderer {
69 item.cardData = Qt.binding(function() { return model; });
69 item.cardData = Qt.binding(function() { return model; });
70 item.template = Qt.binding(function() { return cardTool.template; });
70 item.template = Qt.binding(function() { return cardTool.template; });
71 item.components = Qt.binding(function() { return cardTool.components; });
71 item.components = Qt.binding(function() { return cardTool.components; });
72− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
72+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
73 item.scopeStyle = root.scopeStyle;
73 item.scopeStyle = root.scopeStyle;
74 }
74 }
75 Connections {
75 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+18−13
@@ -131,21 +131,26 @@ 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.AlignLeft;
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"]);
142+
143− var hasSummary = summary && (typeof summary === "string" || summary["field"])
143+ for (var key in keys) {
144−
144+ key = keys[key];
145− var isOnlyTextComponent = !hasSubtitle && !hasPrice && !hasSummary;
145+ try {
146− if (!isOnlyTextComponent) return Text.AlignLeft;
146+ if (typeof components[key] === "string"
147+ || typeof components[key]["field"] === "string") return Text.AlignLeft;
148+ } catch (e) {
149+ continue;
150+ }
151+ }
147
152
148− return (template["card-layout"] === "horizontal") ? Text.AlignLeft : Text.AlignHCenter;
153+ return Text.AlignHCenter;
149 }
154 }
150
155
151 QtObject {
156 QtObject {
qml/Dash/CardVerticalJournal.qml+1−1
@@ -57,7 +57,7 @@ DashRenderer {
57 item.cardData = Qt.binding(function() { return model; });
57 item.cardData = Qt.binding(function() { return model; });
58 item.template = Qt.binding(function() { return cardTool.template; });
58 item.template = Qt.binding(function() { return cardTool.template; });
59 item.components = Qt.binding(function() { return cardTool.components; });
59 item.components = Qt.binding(function() { return cardTool.components; });
60− item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
60+ item.titleAlignment = Qt.binding(function() { return cardTool.titleAlignment; });
61 item.scopeStyle = root.scopeStyle;
61 item.scopeStyle = root.scopeStyle;
62 }
62 }
63 Connections {
63 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+3−3
@@ -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"] || "";
@@ -74,8 +74,8 @@ Label {
74 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
74 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
75 visible: showHeader ;
75 visible: showHeader ;
76 text: root.title;
76 text: root.title;
77− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
77+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
78− horizontalAlignment: root.headerAlignment;
78+ horizontalAlignment: root.titleAlignment;
79 }
79 }
80UbuntuShape {
80UbuntuShape {
81 id: touchdown;
81 id: touchdown;
tests/plugins/Dash/cardcreator/2.res+4−5
@@ -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"] || "";
@@ -98,8 +98,8 @@ Image {
98 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && 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 && 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 && 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 && 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
121
123 ]
122 ]
tests/plugins/Dash/cardcreator/3.res+4−5
@@ -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"] || "";
@@ -74,8 +74,8 @@ Label {
74 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
74 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
75 visible: showHeader ;
75 visible: showHeader ;
76 text: root.title;
76 text: root.title;
77− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
77+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
78− horizontalAlignment: root.headerAlignment;
78+ horizontalAlignment: root.titleAlignment;
79 }
79 }
80Label {
80Label {
81 id: subtitleLabel;
81 id: subtitleLabel;
@@ -87,13 +87,12 @@ Label {
87 }
87 }
88 anchors.topMargin: units.dp(2);
88 anchors.topMargin: units.dp(2);
89 elide: Text.ElideRight;
89 elide: Text.ElideRight;
90− fontSize: "small";
90+ fontSize: "x-small";
91 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
91 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
92 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
92 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
93 visible: titleLabel.visible && titleLabel.text;
93 visible: titleLabel.visible && titleLabel.text;
94 text: cardData && cardData["subtitle"] || "";
94 text: cardData && cardData["subtitle"] || "";
95 font.weight: Font.Light;
95 font.weight: Font.Light;
96− horizontalAlignment: root.headerAlignment;
97 }
96 }
98UbuntuShape {
97UbuntuShape {
99 id: touchdown;
98 id: touchdown;
tests/plugins/Dash/cardcreator/4.res+4−5
@@ -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"] || "";
@@ -78,8 +78,8 @@ Label {
78 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
78 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
79 visible: showHeader ;
79 visible: showHeader ;
80 text: root.title;
80 text: root.title;
81− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
81+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
82− horizontalAlignment: root.headerAlignment;
82+ horizontalAlignment: root.titleAlignment;
83 }
83 }
84,Label {
84,Label {
85 id: subtitleLabel;
85 id: subtitleLabel;
@@ -91,13 +91,12 @@ Label {
91 }
91 }
92 anchors.topMargin: units.dp(2);
92 anchors.topMargin: units.dp(2);
93 elide: Text.ElideRight;
93 elide: Text.ElideRight;
94− fontSize: "small";
94+ fontSize: "x-small";
95 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
95 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
96 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
96 color: root.scopeStyle ? root.scopeStyle.foreground : Theme.palette.normal.baseText;
97 visible: titleLabel.visible && titleLabel.text;
97 visible: titleLabel.visible && titleLabel.text;
98 text: cardData && cardData["subtitle"] || "";
98 text: cardData && cardData["subtitle"] || "";
99 font.weight: Font.Light;
99 font.weight: Font.Light;
100− horizontalAlignment: root.headerAlignment;
101 }
100 }
102]
101]
103}
102}
tests/plugins/Dash/cardcreator/5.res+4−5
@@ -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"] || "";
@@ -118,8 +118,8 @@ Label {
118 color: root.scopeStyle && overlayLoader.item ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item && overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
118 color: root.scopeStyle && overlayLoader.item ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item && overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
119 visible: showHeader && overlayLoader.active;
119 visible: showHeader && overlayLoader.active;
120 text: root.title;
120 text: root.title;
121− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
121+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
122− horizontalAlignment: root.headerAlignment;
122+ horizontalAlignment: root.titleAlignment;
123 }
123 }
124Label {
124Label {
125 id: subtitleLabel;
125 id: subtitleLabel;
@@ -132,13 +132,12 @@ Label {
132 }
132 }
133 anchors.topMargin: units.dp(2);
133 anchors.topMargin: units.dp(2);
134 elide: Text.ElideRight;
134 elide: Text.ElideRight;
135− fontSize: "small";
135+ fontSize: "x-small";
136 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
136 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
137 color: root.scopeStyle && overlayLoader.item ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item && overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
137 color: root.scopeStyle && overlayLoader.item ? root.scopeStyle.getTextColor(overlayLoader.item.luminance) : (overlayLoader.item && overlayLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
138 visible: titleLabel.visible && titleLabel.text;
138 visible: titleLabel.visible && titleLabel.text;
139 text: cardData && cardData["subtitle"] || "";
139 text: cardData && cardData["subtitle"] || "";
140 font.weight: Font.Light;
140 font.weight: Font.Light;
141− horizontalAlignment: root.headerAlignment;
142 }
141 }
143UbuntuShape {
142UbuntuShape {
144 id: touchdown;
143 id: touchdown;
tests/plugins/Dash/cardcreator/6.res+5−7
@@ -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"] || "";
@@ -73,8 +73,8 @@ Item {
73 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && 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 && 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 && 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 && 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 && 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 && 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+4−5
@@ -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"] || "";
@@ -99,8 +99,8 @@ Image {
99 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
99 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
100 visible: showHeader ;
100 visible: showHeader ;
101 text: root.title;
101 text: root.title;
102− font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
102+ font.weight: cardData && cardData["subtitle"] ? Font.DemiBold : Font.Normal;
103− horizontalAlignment: root.headerAlignment;
103+ horizontalAlignment: root.titleAlignment;
104 }
104 }
105,Label {
105,Label {
106 id: subtitleLabel;
106 id: subtitleLabel;
@@ -112,13 +112,12 @@ Image {
112 }
112 }
113 anchors.topMargin: units.dp(2);
113 anchors.topMargin: units.dp(2);
114 elide: Text.ElideRight;
114 elide: Text.ElideRight;
115− fontSize: "small";
115+ fontSize: "x-small";
116 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
116 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
117 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
117 color: backgroundLoader.active && backgroundLoader.item && root.scopeStyle ? root.scopeStyle.getTextColor(backgroundLoader.item.luminance) : (backgroundLoader.item && backgroundLoader.item.luminance > 0.7 ? Theme.palette.normal.baseText : "white");
118 visible: titleLabel.visible && titleLabel.text;
118 visible: titleLabel.visible && titleLabel.text;
119 text: cardData && cardData["subtitle"] || "";
119 text: cardData && cardData["subtitle"] || "";
120 font.weight: Font.Light;
120 font.weight: Font.Light;
121− horizontalAlignment: root.headerAlignment;
122 }
121 }
123,CardAttributes {
122,CardAttributes {
124 id: attributesRow;
123 id: attributesRow;
tests/qmltests/Dash/CardHelpers.js+1−12
@@ -16,7 +16,7 @@
16
16
17.pragma library
17.pragma library
18
18
19−var components = ["title", "art", "subtitle", "mascot", "emblem", "old-price", "price", "alt-price", "rating", "alt-rating", "summary", "attributes", "overlayColor"]
19+var components = ["title", "art", "subtitle", "mascot", "emblem", "summary", "attributes", "overlayColor"]
20
20
21var defaultLayout = ' \
21var defaultLayout = ' \
22{ \
22{ \
@@ -37,17 +37,6 @@ var defaultLayout = ' \
37 "overlayColor": null, \
37 "overlayColor": null, \
38 "mascot": null, \
38 "mascot": null, \
39 "emblem": null, \
39 "emblem": null, \
40− "old-price": null, \
41− "price": null, \
42− "alt-price": null, \
43− "rating": { \
44− "type": "stars", \
45− "range": [0, 5], \
46− "full": "image://theme/rating-star-full", \
47− "half": "image://theme/rating-star-half", \
48− "empty": "image://theme/rating-star-empty" \
49− }, \
50− "alt-rating": null, \
51 "summary": null, \
40 "summary": null, \
52 "attributes": { "max-count": 2 } \
41 "attributes": { "max-count": 2 } \
53 }, \
42 }, \
tests/qmltests/Dash/tst_CardTool.qml+28−20
@@ -85,8 +85,8 @@ 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 },
90 },
91 ]
91 ]
92
92
@@ -100,6 +100,7 @@ Rectangle {
100 }
100 }
101
101
102 Column {
102 Column {
103+ id: column
103 width: units.gu(38)
104 width: units.gu(38)
104 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
105 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
105
106
@@ -111,7 +112,7 @@ Rectangle {
111 ]
112 ]
112
113
113 delegate: Row {
114 delegate: Row {
114− anchors { left: parent.left; right: parent.right; margins: units.gu(3) }
115+ anchors { left: column.left; right: column.right; margins: units.gu(3) }
115
116
116 Label {
117 Label {
117 height: units.gu(5)
118 height: units.gu(5)
@@ -315,28 +316,35 @@ Rectangle {
315 }
316 }
316 }
317 }
317
318
318− function test_card_header_component_alignment_data() {
319+ function test_card_title_alignment_data() {
319 return [
320 return [
320− { tag: "Title - vertical", component: "titleLabel", property: "headerAlignment",
321+ { tag: "Art, header, summary", value: Text.AlignLeft, index: 0 },
322+ { tag: "Header, summary", value: Text.AlignLeft, index: 1 },
323+ { tag: "Art, header", value: Text.AlignLeft, index: 2 },
324+ { tag: "Header only", value: Text.AlignLeft, index: 3 },
325+ { tag: "Header title only", value: Text.AlignHCenter, index: 4 },
326+ { tag: "Header title and subtitle", value: Text.AlignLeft, index: 5 },
327+ { tag: "Header title and mascot", value: Text.AlignLeft, index: 6 },
328+ { tag: "Art, header, summary - small", value: Text.AlignLeft, index: 7 },
329+ { tag: "Art, header, summary - large", value: Text.AlignLeft, index: 8 },
330+ { tag: "Art, header, summary - horizontal", value: Text.AlignLeft, index: 9 },
331+ { tag: "Art, header - portrait", value: Text.AlignLeft, index: 10 },
321− value: Text.AlignHCenter, index: 11, layout_index: 0 },
332+ { tag: "Title - vertical", value: Text.AlignHCenter, index: 11 },
322− { tag: "Title - horizontal", component: "titleLabel", property: "headerAlignment",
323− value: Text.AlignLeft, index: 12, layout_index: 0},
333+ { tag: "Title - horizontal", value: Text.AlignLeft, index: 12 },
324− { tag: "Title, subtitle - vertical", component: "titleLabel", property: "headerAlignment",
325− value: Text.AlignLeft, index: 13, layout_index: 0},
334+ { tag: "Title, subtitle - vertical", value: Text.AlignLeft, index: 13 },
326− { tag: "Title, price - horizontal", component: "titleLabel", property: "headerAlignment",
327− value: Text.AlignLeft, index: 14, layout_index: 0},
335+ { tag: "Title, attributes - horizontal", value: Text.AlignLeft, index: 14 },
328− ]
336+ ];
329 }
337 }
330
338
331− function test_card_header_component_alignment(data) {
339+ function test_card_title_alignment(data) {
332 selector.selectedIndex = data.index;
340 selector.selectedIndex = data.index;
333− if (data.hasOwnProperty("layout_index")) {
334− layoutSelector.selectedIndex = data.layout_index;
335− }
336
341
337− if (data.hasOwnProperty("property")) {
342+ tryCompare(cardTool, "titleAlignment", Text.AlignLeft);
338− tryCompare(cardTool, data.property, data.value);
343+
339− }
344+ cardTool.components['title'] = { "field": "title", "align": "center" };
345+ cardTool.componentsChanged();
346+
347+ tryCompare(cardTool, "titleAlignment", data.value);
340 }
348 }
341
349
342 function test_categoryLayout_data() {
350 function test_categoryLayout_data() {