git.iko.soy/unity8
on xenial help sign in
Add new horizontal list category layout. Fixes: 1352226

Approved by: Andrea Cimitan

commit2dbf5dd7f37abc785a3b7c18882ed4a4681202a8 authorMichał Sawicz <michal.sawicz@canonical.com> dateThu 14 Aug 2014, 01:28 (12 years ago) parent548e0443bfc664
4 files changed+71
compare with xenial
unifiedsplit
qml/Dash/CardHorizontalList.qml+62 qml/Dash/CardTool.qml+2 qml/Dash/GenericScopeView.qml+1 tests/qmltests/Dash/tst_CardTool.qml+6
qml/Dash/CardHorizontalList.qmlnew file+62
@@ -0,0 +1,62 @@
1+/*
2+ * Copyright (C) 2014 Canonical, Ltd.
3+ *
4+ * This program is free software; you can redistribute it and/or modify
5+ * it under the terms of the GNU General Public License as published by
6+ * the Free Software Foundation; version 3.
7+ *
8+ * This program is distributed in the hope that it will be useful,
9+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
10+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11+ * GNU General Public License for more details.
12+ *
13+ * You should have received a copy of the GNU General Public License
14+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
15+ */
16+
17+import QtQuick 2.2
18+import Ubuntu.Components 1.1
19+import "../Components"
20+
21+DashRenderer {
22+ id: root
23+
24+ expandedHeight: cardTool.cardHeight + units.gu(2)
25+ collapsedHeight: expandedHeight
26+ clip: true
27+
28+ ListView {
29+ id: listView
30+ anchors {
31+ fill: parent
32+ margins: units.gu(1)
33+ rightMargin: 0
34+ }
35+ rightMargin: units.gu(1)
36+ spacing: units.gu(1)
37+ model: root.model
38+ orientation: ListView.Horizontal
39+
40+ delegate: Loader {
41+ id: loader
42+ sourceComponent: cardTool.cardComponent
43+ anchors { top: parent.top; bottom: parent.bottom }
44+ width: cardTool.cardWidth
45+ onLoaded: {
46+ item.objectName = "delegate" + index;
47+ item.fixedArtShapeSize = Qt.binding(function() { return cardTool.artShapeSize; });
48+ item.fixedHeaderHeight = Qt.binding(function() { return cardTool.headerHeight; });
49+ item.cardData = Qt.binding(function() { return model; });
50+ item.template = Qt.binding(function() { return cardTool.template; });
51+ item.components = Qt.binding(function() { return cardTool.components; });
52+ item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
53+ item.scopeStyle = root.scopeStyle;
54+ }
55+ Connections {
56+ target: loader.item
57+ onClicked: root.clicked(index, result)
58+ onPressAndHold: root.pressAndHold(index)
59+ }
60+ }
61+ }
62+}
qml/Dash/CardTool.qml+2
@@ -91,6 +91,7 @@ Item {
9191 }
9292 return units.gu(18.5);
9393 case "carousel":
94+ case "horizontal-list":
9495 return carouselTool.minimumTileWidth;
9596 case undefined:
9697 case "organic-grid":
@@ -111,6 +112,7 @@ Item {
111112 if (template["card-size"] >= 12 && template["card-size"] <= 38) return units.gu(template["card-size"]);
112113 return units.gu(18.5);
113114 case "grid":
115+ case "horizontal-list":
114116 return cardLoader.item ? cardLoader.item.implicitHeight : 0
115117 case "carousel":
116118 return cardWidth / (components ? components["art"]["aspect-ratio"] : 1)
qml/Dash/GenericScopeView.qml+1
@@ -227,6 +227,7 @@ FocusScope {
227227 switch (cardTool.categoryLayout) {
228228 case "carousel": return "CardCarousel.qml";
229229 case "vertical-journal": return "CardVerticalJournal.qml";
230+ case "horizontal-list": return "CardHorizontalList.qml";
230231 case "grid":
231232 default: return "CardGrid.qml";
232233 }
tests/qmltests/Dash/tst_CardTool.qml+6
@@ -163,6 +163,7 @@ Rectangle {
163163 { label: "Horizontal Journal", layout: "journal" },
164164 { label: "Vertical Journal", layout: "vertical-journal" },
165165 { label: "Carousel", layout: "carousel" },
166+ { label: "Horizontal List", layout: "horizontal-list" },
166167 ]
167168 delegate: OptionSelectorDelegate { text: modelData.label }
168169 onSelectedIndexChanged: {
@@ -226,6 +227,7 @@ Rectangle {
226227 case "journal": layoutSelector.selectedIndex = 2; break;
227228 case "vertical-journal": layoutSelector.selectedIndex = 3; break;
228229 case "carousel": layoutSelector.selectedIndex = 4; break;
230+ case "horizontal-list": layoutSelector.selectedIndex = 5; break;
229231 case "grid":
230232 default: layoutSelector.selectedIndex = 0; break;
231233 }
@@ -270,6 +272,10 @@ Rectangle {
270272 { tag: "MediumCarousel", width: units.gu(22), height: units.gu(22), viewWidth: 84, index: 0, layout_index: 4},
271273 { tag: "LargeCarousel", width: units.gu(26), height: units.gu(26), viewWidth: 140, index: 0, layout_index: 4},
272274 { tag: "PortraitCarousel", width: units.gu(22), height: units.gu(44), viewWidth: 84, index: 10, layout_index: 4},
275+ { tag: "SmallHorizontalList", width: units.gu(18), height: units.gu(39.5), viewWidth: 30, index: 0, layout_index: 5},
276+ { tag: "MediumHorizontalList", width: units.gu(22), height: units.gu(43.5), viewWidth: 84, index: 0, layout_index: 5},
277+ { tag: "LargeHorizontalList", width: units.gu(26), height: units.gu(47.5), viewWidth: 140, index: 0, layout_index: 5},
278+ { tag: "PortraitHorizontalList", width: units.gu(22), height: units.gu(65.5), viewWidth: 84, index: 10, layout_index: 5},
273279 ]
274280 }
275281