git.iko.soy/unity8
on xenial help sign in
Make the card carousel use the card creator
ecb7a65Albert Astals
plugins/Dash/CardCreator.js+7−5
compare with xenial
unifiedsplit
@@ -159,7 +159,7 @@ function createCardComponent(parent, template, components) {
159 } \
159 } \
160 active: artShapeLoader.active && artShapeLoader.item && artShapeLoader.item.image.status === Image.Ready || false; \
160 active: artShapeLoader.active && artShapeLoader.item && artShapeLoader.item.image.status === Image.Ready || false; \
161 asynchronous: root.asynchronous; \
161 asynchronous: root.asynchronous; \
162− visible: status == Loader.Ready; \
162+ visible: showHeader && status == Loader.Ready; \
163 sourceComponent: ShaderEffect { \
163 sourceComponent: ShaderEffect { \
164 id: overlay; \
164 id: overlay; \
165 height: ' + height + ' \
165 height: ' + height + ' \
@@ -247,7 +247,7 @@ function createCardComponent(parent, template, components) {
247 objectName: "mascotShapeLoader"; \
247 objectName: "mascotShapeLoader"; \
248 asynchronous: root.asynchronous; \
248 asynchronous: root.asynchronous; \
249 active: mascotImage.status === Image.Ready; \
249 active: mascotImage.status === Image.Ready; \
250− visible: active && status == Loader.Ready; \
250+ visible: showHeader && active && status == Loader.Ready; \
251 width: units.gu(6); \
251 width: units.gu(6); \
252 height: units.gu(5.625); \
252 height: units.gu(5.625); \
253 sourceComponent: UbuntuShape { image: mascotImage } \
253 sourceComponent: UbuntuShape { image: mascotImage } \
@@ -267,7 +267,7 @@ function createCardComponent(parent, template, components) {
267 fillMode: Image.PreserveAspectCrop; \
267 fillMode: Image.PreserveAspectCrop; \
268 horizontalAlignment: Image.AlignHCenter; \
268 horizontalAlignment: Image.AlignHCenter; \
269 verticalAlignment: Image.AlignVCenter; \
269 verticalAlignment: Image.AlignVCenter; \
270− visible:' + (useMascotShape ? 'false' : 'true') + '; \
270+ visible: showHeader && ' + (useMascotShape ? 'false' : 'true') + '; \
271 }';
271 }';
272 }
272 }
273
273
@@ -297,7 +297,8 @@ function createCardComponent(parent, template, components) {
297 } else if (hasMascot) {
297 } else if (hasMascot) {
298 titleAnchors = 'anchors.verticalCenter: parent.verticalCenter;'
298 titleAnchors = 'anchors.verticalCenter: parent.verticalCenter;'
299 } else if (inOverlay && hasSubtitle) {
299 } else if (inOverlay && hasSubtitle) {
300+ titleAnchors = 'anchors.leftMargin: units.gu(1); \
300− titleAnchors = 'anchors.right: parent.right; \
301+ anchors.right: parent.right; \
301 anchors.bottom: subtitleLabel.top; \
302 anchors.bottom: subtitleLabel.top; \
302 anchors.bottomMargin: units.dp(2);';
303 anchors.bottomMargin: units.dp(2);';
303 titleAnchors += headerLeftAnchor;
304 titleAnchors += headerLeftAnchor;
@@ -331,6 +332,7 @@ function createCardComponent(parent, template, components) {
331 maximumLineCount: 2; \
332 maximumLineCount: 2; \
332 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
333 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
333 color: ' + color + '; \
334 color: ' + color + '; \
335+ visible: showHeader; \
334 text: root.title; \
336 text: root.title; \
335 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal; \
337 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal; \
336 horizontalAlignment: root.headerAlignment; \
338 horizontalAlignment: root.headerAlignment; \
@@ -345,7 +347,7 @@ function createCardComponent(parent, template, components) {
345 fontSize: "small"; \
347 fontSize: "small"; \
346 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
348 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
347 color: ' + color + '; \
349 color: ' + color + '; \
348− visible: titleLabel.text; \
350+ visible: showHeader && titleLabel.text; \
349 text: cardData && cardData["subtitle"] || ""; \
351 text: cardData && cardData["subtitle"] || ""; \
350 font.weight: Font.Light; \
352 font.weight: Font.Light; \
351 horizontalAlignment: root.headerAlignment; \
353 horizontalAlignment: root.headerAlignment; \
qml/Dash/CardCarousel.qml+14−10
@@ -49,21 +49,25 @@ DashRenderer {
49 property real fontScale: 1 / selectedItemScaleFactor
49 property real fontScale: 1 / selectedItemScaleFactor
50 property real headerHeight: cardTool.headerHeight / selectedItemScaleFactor
50 property real headerHeight: cardTool.headerHeight / selectedItemScaleFactor
51
51
52− itemComponent: Card {
52+ itemComponent: Loader {
53− id: card
53+ id: loader
54− objectName: "carouselDelegate" + index
55− fixedHeaderHeight: carousel.headerHeight
56− cardData: model
57− template: cardTool.template
58− components: cardTool.components
59
54
60 property bool explicitlyScaled
55 property bool explicitlyScaled
61 property var model
56 property var model
62−
63 enabled: false
57 enabled: false
64− showHeader: explicitlyScaled
65
58
59+ sourceComponent: cardTool.cardComponent
60+ anchors.horizontalCenter: parent.horizontalCenter
61+ onLoaded: {
62+ item.objectName = "carouselDelegate" + index;
63+// item.fixedHeaderHeight = Qt.binding(function() { return cardTool.headerHeight; });
64+ item.height = Qt.binding(function() { return cardTool.cardHeight; });
65+ item.cardData = Qt.binding(function() { return model; });
66+ item.template = Qt.binding(function() { return cardTool.template; });
67+ item.components = Qt.binding(function() { return cardTool.components; });
66− fontScale: carousel.fontScale
68+ item.fontScale = Qt.binding(function() { return carousel.fontScale; });
69+ item.showHeader = Qt.binding(function() { return loader.explicitlyScaled; });
70+ }
67 }
71 }
68 }
72 }
69}
73}
tests/mocks/Unity/fake_categories.cpp+14−2
@@ -108,7 +108,12 @@ Categories::data(const QModelIndex& index, int role) const
108 case RoleRenderer:
108 case RoleRenderer:
109 {
109 {
110 QVariantMap map;
110 QVariantMap map;
111− map["category-layout"] = index.row() % 2 == 0 ? "grid" : "carousel";
111+ if (index.row() % 2 == 0) {
112+ map["category-layout"] = "grid";
113+ } else {
114+ map["category-layout"] = "carousel";
115+ map["overlay"] = true;
116+ }
112 map["card-size"] = "small";
117 map["card-size"] = "small";
113 return map;
118 return map;
114 }
119 }
@@ -146,7 +151,14 @@ Categories::data(const QModelIndex& index, int role) const
146 case RoleRenderer:
151 case RoleRenderer:
147 {
152 {
148 QVariantMap map;
153 QVariantMap map;
149− map["category-layout"] = index.row() % 2 == 0 ? "grid" : "carousel";
154+ if (index.row() % 2 == 0) {
155+ map["category-layout"] = "grid";
156+ } else {
157+ map["category-layout"] = "carousel";
158+ map["card-size"] = "medium";
159+ map["collapsed-rows"] = 2;
160+ map["overlay"] = true;
161+ }
150 map["card-size"] = "small";
162 map["card-size"] = "small";
151 return map;
163 return map;
152 }
164 }