on xenial help sign in
Make the card sizes a bit dependant on the total of gu of the dash
commit3a72c5fa7a817e73e3fd36c7f727d2d5b10e67c5 authorAlbert Astals Cid <albert.astals@canonical.com> dateWed 8 Jul 2015, 15:01 (11 years ago) parent523f97318cb112
5 files changed+35−19
qml/Dash/CardTool.qml+15−6 qml/Dash/GenericScopeView.qml+7 tests/qmltests/Dash/tst_Card.qml+4−4 tests/qmltests/Dash/tst_CardTool.qml+8−8 tests/qmltests/Dash/tst_GenericScopeView.qml+1−1
qml/Dash/CardTool.qml+15−6
@@ -80,16 +80,25 @@ Item {
8080
8181 If undefined, should use implicit width of the actual card.
8282 */
83− readonly property var cardWidth: {
83+ property var cardWidth: {
8484 switch (categoryLayout) {
8585 case "grid":
8686 case "vertical-journal":
87− if (template["card-layout"] === "horizontal") return units.gu(38);
88− switch (template["card-size"]) {
89− case "small": return units.gu(12);
90− case "large": return units.gu(38);
87+ var size = template["card-size"];
88+ if (template["card-layout"] === "horizontal") size = "large";
89+ switch (size) {
90+ case "small": {
91+ if (viewWidth <= units.gu(45)) return units.gu(12);
92+ else return units.gu(14);
93+ }
94+ case "large": {
95+ if (viewWidth >= units.gu(70)) return units.gu(42);
96+ else return viewWidth - units.gu(2);
97+ }
9198 }
92− return units.gu(18.5);
99+ if (viewWidth <= units.gu(45)) return units.gu(18);
100+ else if (viewWidth >= units.gu(70)) return units.gu(20);
101+ else return units.gu(23);
93102 case "carousel":
94103 case "horizontal-list":
95104 return carouselTool.minimumTileWidth;
qml/Dash/GenericScopeView.qml+7
@@ -332,6 +332,13 @@ FocusScope {
332332 updateRanges();
333333 if (scope && scope.id === "clickscope" && (categoryId === "predefined" || categoryId === "local")) {
334334 // Yeah, hackish :/
335+ if (scopeView.width > units.gu(45)) {
336+ if (scopeView.width >= units.gu(70)) {
337+ cardTool.cardWidth = units.gu(9);
338+ } else {
339+ cardTool.cardWidth = units.gu(10);
340+ }
341+ }
335342 cardTool.artShapeSize = Qt.size(units.gu(8), units.gu(7.5));
336343 }
337344 item.cardTool = cardTool;
tests/qmltests/Dash/tst_Card.qml+4−4
@@ -112,7 +112,7 @@ Rectangle {
112112 id: cardTool
113113 template: Helpers.update(JSON.parse(Helpers.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['template'];
114114 components: Helpers.update(JSON.parse(Helpers.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['components'];
115− viewWidth: units.gu(48)
115+ viewWidth: units.gu(40)
116116 }
117117
118118 readonly property var card: loader.item
@@ -261,10 +261,10 @@ Rectangle {
261261
262262 function test_card_size_data() {
263263 return [
264− { tag: "Medium", width: units.gu(18.5), index: 0 },
264+ { tag: "Medium", width: units.gu(18), index: 0 },
265265 { tag: "Small", width: units.gu(12), index: 1 },
266266 { tag: "Large", width: units.gu(38), index: 2 },
267− { tag: "Wide", width: units.gu(18.5), index: 0 },
267+ { tag: "Wide", width: units.gu(18), index: 0 },
268268 { tag: "Horizontal", width: units.gu(38), index: 5 },
269269 // Make sure card ends with header when there's no summary
270270 { tag: "NoSummary", height: function() { var cardToolRow = findChild(cardTool, "outerRow");
@@ -296,7 +296,7 @@ Rectangle {
296296
297297 function test_art_size_data() {
298298 return [
299− { tag: "Medium", width: units.gu(18.5), fill: Image.PreserveAspectCrop, index: 0 },
299+ { tag: "Medium", width: units.gu(18), fill: Image.PreserveAspectCrop, index: 0 },
300300 { tag: "Small", width: units.gu(12), index: 1 },
301301 { tag: "Large", width: units.gu(38), index: 2 },
302302 { tag: "Wide", height: units.gu(19), size: "large", index: 3 },
tests/qmltests/Dash/tst_CardTool.qml+8−8
@@ -255,20 +255,20 @@ Rectangle {
255255
256256 function test_card_size_data() {
257257 return [
258− { tag: "Medium", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 0 },
259− { tag: "No art", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 1 },
260− { tag: "No summary", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 2 },
261− { tag: "Just header", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 3 },
262− { tag: "Just title", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 4 },
263− { tag: "Title and subtitle", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 5 },
264− { tag: "Title and mascot", width: units.gu(18.5), height: function() { return internalCard ? internalCard.height : 0 }, index: 6 },
258+ { tag: "Medium", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 0 },
259+ { tag: "No art", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 1 },
260+ { tag: "No summary", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 2 },
261+ { tag: "Just header", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 3 },
262+ { tag: "Just title", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 4 },
263+ { tag: "Title and subtitle", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 5 },
264+ { tag: "Title and mascot", width: units.gu(18), height: function() { return internalCard ? internalCard.height : 0 }, index: 6 },
265265 { tag: "Small", width: units.gu(12), height: function() { return internalCard ? internalCard.height : 0 }, index: 7 },
266266 { tag: "Large", width: units.gu(38), height: function() { return internalCard ? internalCard.height : 0 }, index: 8 },
267267 { tag: "Horizontal", width: units.gu(38), height: function() { return internalCard ? internalCard.height : 0 }, index: 9 },
268268 { tag: "OrganicGrid", width: undefined, height: undefined, index: 0, layout_index: 1},
269269 { tag: "Journal", width: undefined, height: units.gu(20), size: 20, index: 0, layout_index: 2 },
270270 { tag: "OversizedJournal", width: undefined, height: units.gu(18.5), size: 40, index: 0, layout_index: 2 },
271− { tag: "VerticalJournal", width: units.gu(18.5), height: undefined, index: 0, layout_index: 3 },
271+ { tag: "VerticalJournal", width: units.gu(18), height: undefined, index: 0, layout_index: 3 },
272272 { tag: "SmallCarousel", width: units.gu(18), height: units.gu(18), viewWidth: 30, index: 0, layout_index: 4},
273273 { tag: "MediumCarousel", width: units.gu(22), height: units.gu(22), viewWidth: 84, index: 0, layout_index: 4},
274274 { tag: "LargeCarousel", width: units.gu(26), height: units.gu(26), viewWidth: 140, index: 0, layout_index: 4},
tests/qmltests/Dash/tst_GenericScopeView.qml+1−1
@@ -88,7 +88,7 @@ Item {
8888 tryCompareFunction(function() {
8989 var category = findChild(genericScopeView, categoryName);
9090 if (category && category.y > 0 && category.y < genericScopeView.height) return true;
91− mouseFlick(genericScopeView, genericScopeView.width/2, genericScopeView.height,
91+ touchFlick(genericScopeView, genericScopeView.width/2, units.gu(20),
9292 genericScopeView.width/2, genericScopeView.y)
9393 tryCompare(categoryListView, "moving", false);
9494 return false;