on xenial help sign in
Horizontal Card layout.
commitd72234a9e3e68cc154ead352bc3465996e5950b8 authorMichał Karnicki <michal.karnicki@canonical.com> dateWed 8 Jan 2014, 21:37 (13 years ago) parentb285bb3
2 files changed+83−14
qml/Dash/Card.qml+14−13 tests/qmltests/Dash/tst_Card.qml+69−1
qml/Dash/Card.qml+14−13
@@ -8,13 +8,14 @@ Item {
88 property var cardData
99
1010 width: {
11− if (template !== undefined) {
12− switch (template['card-size']) {
13− case "small": return units.gu(12);
14− case "large": return units.gu(38);
15− }
16− }
17− return units.gu(18.5);
11+ if (template !== undefined) {
12+ if (template["card-layout"] === "horizontal") return units.gu(38);
13+ switch (template['card-size']) {
14+ case "small": return units.gu(12);
15+ case "large": return units.gu(38);
16+ }
17+ }
18+ return units.gu(18.5);
1819 }
1920 height: childrenRect.height
2021
@@ -23,19 +24,19 @@ Item {
2324 objectName: "artShape"
2425 width: image.fillMode === Image.PreserveAspectCrop || aspect < image.aspect ? image.width : height * image.aspect
2526 height: image.fillMode === Image.PreserveAspectCrop || aspect > image.aspect ? image.height : width / image.aspect
26− anchors.horizontalCenter: parent.horizontalCenter
27+ anchors.horizontalCenter: template && template["card-layout"] === "horizontal" ? undefined : parent.horizontalCenter
2728
2829 property real aspect: components !== undefined ? components["art"]["aspect-ratio"] : 1
2930
3031 image: Image {
31− width: root.width
32− height: width / artShape.aspect
32+ width: template && template["card-layout"] === "horizontal" ? height * artShape.aspect : root.width
33+ height: template && template["card-layout"] === "horizontal" ? header.height : width / artShape.aspect
3334 objectName: "artImage"
3435 source: cardData && cardData["art"] || ""
3536 // FIXME uncomment when having investigated / fixed the crash
3637 //sourceSize.width: width > height ? width : 0
3738 //sourceSize.height: height > width ? height : 0
38− fillMode: components["art"]["fill-mode"] == "fit" ? Image.PreserveAspectFit: Image.PreserveAspectCrop
39+ fillMode: components["art"]["fill-mode"] === "fit" ? Image.PreserveAspectFit: Image.PreserveAspectCrop
3940
4041 property real aspect: implicitWidth / implicitHeight
4142 }
@@ -45,8 +46,8 @@ Item {
4546 id: header
4647 objectName: "cardHeader"
4748 anchors {
48− top: artShape.bottom
49− left: parent.left
49+ top: template && template["card-layout"] === "horizontal" ? artShape.top : artShape.bottom
50+ left: template && template["card-layout"] === "horizontal" ? artShape.right : parent.left
5051 right: parent.right
5152 }
5253
tests/qmltests/Dash/tst_Card.qml+69−1
@@ -84,7 +84,12 @@ Rectangle {
8484 {
8585 "name": "Art, title - vertical, fitted",
8686 "layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "art": { "fill-mode": "fit" } }) }
87− }
87+ },
88+ {
89+ "name": "Art, header, summary - horizontal",
90+ "layout": { "template": { "card-layout": "horizontal", "card-size": "medium" },
91+ "components": JSON.parse(fullMapping) }
92+ },
8893 ]
8994
9095 Card {
@@ -274,5 +279,68 @@ Rectangle {
274279 tryCompare(artImage, "fillMode", data.fill);
275280 }
276281 }
282+
283+ function test_art_image_size_data() {
284+ return [
285+ { tag: "CardVerticalMedium", width: header.width, index: 0 },
286+ { tag: "CardHorizontalMedium", height: header.height, index: 5 },
287+ ]
288+ }
289+
290+ function test_art_image_size(data) {
291+ selector.selectedIndex = data.index;
292+
293+ if (data.hasOwnProperty("width")) {
294+ tryCompare(artImage, "width", data.width);
295+ }
296+
297+ if (data.hasOwnProperty("height")) {
298+ tryCompare(artImage, "height", data.height);
299+ }
300+ }
301+
302+ function test_card_horizontal_layout_data() {
303+ return [
304+ { tag: "Horizontal", width: units.gu(38), index: 5 }
305+ ]
306+ }
307+
308+ function test_card_horizontal_layout(data) {
309+ selector.selectedIndex = data.index;
310+
311+ if (data.hasOwnProperty("width")) {
312+ tryCompare(card, "width", data.width);
313+ }
314+ }
315+
316+ function test_art_anchors_data() {
317+ return [
318+ { tag: "CardVertical", headerX: 0, index: 0 },
319+ { tag: "CardHorizontal", headerX: artImage.width, index: 5 },
320+ ];
321+ }
322+
323+ function test_art_anchors(data) {
324+ selector.selectedIndex = data.index;
325+
326+ if (data.hasOwnProperty("headerX")) {
327+ tryCompare(testCase.header.x, data.headerLeft, data.value);
328+ }
329+ }
330+
331+ function test_header_anchors_data() {
332+ return [
333+ { tag: "CardVertical", top: art.bottom, left: card.left, index: 0 },
334+ { tag: "CardHorizontal", top: art.top, left: art.right, index: 5 }
335+ ]
336+ }
337+
338+ function test_header_anchors(data) {
339+ selector.selectedIndex = data.index;
340+
341+ tryCompare(testCase.header, "top", data.top);
342+ tryCompare(testCase.header, "left", data.left);
343+ }
344+
277345 }
278346}