2dbf5dd · unity8 · git.iko.soy

git.iko.soy/unity8

on xenial help sign in

Add new horizontal list category layout. Fixes: 1352226

2dbf5ddMichał Sawicz12 years ago

qml/Dash/CardHorizontalList.qmlnew file+62

compare with xenial

unifiedsplit

@@ -0,0 +1,62 @@

1+/*

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 {

91 }

92 return units.gu(18.5);

93 case "carousel":

94+ case "horizontal-list":

94 return carouselTool.minimumTileWidth;

95 return carouselTool.minimumTileWidth;

95 case undefined:

96 case undefined:

96 case "organic-grid":

97 case "organic-grid":

@@ -111,6 +112,7 @@ Item {

111 if (template["card-size"] >= 12 && template["card-size"] <= 38) return units.gu(template["card-size"]);

112 if (template["card-size"] >= 12 && template["card-size"] <= 38) return units.gu(template["card-size"]);

112 return units.gu(18.5);

113 return units.gu(18.5);

113 case "grid":

114 case "grid":

115+ case "horizontal-list":

114 return cardLoader.item ? cardLoader.item.implicitHeight : 0

116 return cardLoader.item ? cardLoader.item.implicitHeight : 0

115 case "carousel":

117 case "carousel":

116 return cardWidth / (components ? components["art"]["aspect-ratio"] : 1)

118 return cardWidth / (components ? components["art"]["aspect-ratio"] : 1)

qml/Dash/GenericScopeView.qml+1

@@ -227,6 +227,7 @@ FocusScope {

227 switch (cardTool.categoryLayout) {

228 case "carousel": return "CardCarousel.qml";

229 case "vertical-journal": return "CardVerticalJournal.qml";

230+ case "horizontal-list": return "CardHorizontalList.qml";

230 case "grid":

231 case "grid":

231 default: return "CardGrid.qml";

232 default: return "CardGrid.qml";

232 }

233 }

tests/qmltests/Dash/tst_CardTool.qml+6

@@ -163,6 +163,7 @@ Rectangle {

163 { label: "Horizontal Journal", layout: "journal" },

164 { label: "Vertical Journal", layout: "vertical-journal" },

165 { label: "Carousel", layout: "carousel" },

166+ { label: "Horizontal List", layout: "horizontal-list" },

166 ]

167 ]

167 delegate: OptionSelectorDelegate { text: modelData.label }

168 delegate: OptionSelectorDelegate { text: modelData.label }

168 onSelectedIndexChanged: {

169 onSelectedIndexChanged: {

@@ -226,6 +227,7 @@ Rectangle {

226 case "journal": layoutSelector.selectedIndex = 2; break;

227 case "journal": layoutSelector.selectedIndex = 2; break;

227 case "vertical-journal": layoutSelector.selectedIndex = 3; break;

228 case "vertical-journal": layoutSelector.selectedIndex = 3; break;

228 case "carousel": layoutSelector.selectedIndex = 4; break;

229 case "carousel": layoutSelector.selectedIndex = 4; break;

230+ case "horizontal-list": layoutSelector.selectedIndex = 5; break;

229 case "grid":

231 case "grid":

230 default: layoutSelector.selectedIndex = 0; break;

232 default: layoutSelector.selectedIndex = 0; break;

231 }

233 }

@@ -270,6 +272,10 @@ Rectangle {

270 { tag: "MediumCarousel", width: units.gu(22), height: units.gu(22), viewWidth: 84, index: 0, layout_index: 4},

272 { tag: "MediumCarousel", width: units.gu(22), height: units.gu(22), viewWidth: 84, index: 0, layout_index: 4},

271 { tag: "LargeCarousel", width: units.gu(26), height: units.gu(26), viewWidth: 140, index: 0, layout_index: 4},

273 { tag: "LargeCarousel", width: units.gu(26), height: units.gu(26), viewWidth: 140, index: 0, layout_index: 4},

272 { tag: "PortraitCarousel", width: units.gu(22), height: units.gu(44), viewWidth: 84, index: 10, layout_index: 4},

274 { 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},

273 ]

279 ]

274 }

280 }

275

281