git.iko.soy/unity8
on xenial help sign in
Make CardVerticalJournal a proper DashRenderer
bc52982Albert Astals
qml/Components/ResponsiveVerticalJournal.qml+7−7
compare with xenial
unifiedsplit
@@ -22,7 +22,7 @@ import Dash 0.1
22// A VerticalJournal, which allows setting max number of columns. Based on
22// A VerticalJournal, which allows setting max number of columns. Based on
23// defined column width, delegates are spread in the horizontal space.
23// defined column width, delegates are spread in the horizontal space.
24Item {
24Item {
25− property int minimumColumnSpacing: units.gu(0.5)
25+ property int minimumColumnSpacing: units.gu(1)
26 property int maximumNumberOfColumns: 2
26 property int maximumNumberOfColumns: 2
27
27
28 property alias columnWidth: verticalJournalView.columnWidth
28 property alias columnWidth: verticalJournalView.columnWidth
@@ -31,16 +31,17 @@ Item {
31 property alias delegate: verticalJournalView.delegate
31 property alias delegate: verticalJournalView.delegate
32 property alias displayMarginBeginning: verticalJournalView.displayMarginBeginning
32 property alias displayMarginBeginning: verticalJournalView.displayMarginBeginning
33 property alias displayMarginEnd: verticalJournalView.displayMarginEnd
33 property alias displayMarginEnd: verticalJournalView.displayMarginEnd
34+ implicitHeight: verticalJournalView.implicitHeight
34
35
35 VerticalJournal {
36 VerticalJournal {
36 id: verticalJournalView
37 id: verticalJournalView
37 objectName: "responsiveVerticalJournalView"
38 objectName: "responsiveVerticalJournalView"
38 anchors {
39 anchors {
39 fill: parent
40 fill: parent
40− leftMargin: columnSpacing/2
41+ leftMargin: columnSpacing / 2
41− rightMargin: columnSpacing/2
42+ rightMargin: columnSpacing / 2
42− topMargin: rowSpacing/2
43+ topMargin: rowSpacing / 2
43− bottomMargin: rowSpacing/2
44+ bottomMargin: rowSpacing / 2
44 }
45 }
45 clip: parent.height != implicitHeight
46 clip: parent.height != implicitHeight
46
47
@@ -59,8 +60,7 @@ Item {
59 return units.gu(spacingGU)
60 return units.gu(spacingGU)
60 }
61 }
61
62
62− property int expectedColumns: Math.min(
63− columnsForSpacing(minimumColumnSpacing), maximumNumberOfColumns)
63+ property int expectedColumns: Math.min(columnsForSpacing(minimumColumnSpacing), maximumNumberOfColumns)
64 columnSpacing: spacingForColumns(expectedColumns)
64 columnSpacing: spacingForColumns(expectedColumns)
65 }
65 }
66}
66}
qml/Dash/CardCarousel.qml−2
@@ -27,9 +27,7 @@ DashRenderer {
27 property alias selectedItemScaleFactor: carousel.selectedItemScaleFactor
27 property alias selectedItemScaleFactor: carousel.selectedItemScaleFactor
28 property alias tileAspectRatio: carousel.tileAspectRatio
28 property alias tileAspectRatio: carousel.tileAspectRatio
29
29
30− currentItem: carousel.currentItem
31 height: carousel.implicitHeight + units.gu(6)
30 height: carousel.implicitHeight + units.gu(6)
32− verticalSpacing: units.gu(3)
33
31
34 Carousel {
32 Carousel {
35 id: carousel
33 id: carousel
qml/Dash/CardFilterGrid.qml+1−4
@@ -22,11 +22,8 @@ DashRenderer {
22
22
23 expandable: filterGrid.expandable
23 expandable: filterGrid.expandable
24 collapsedHeight: filterGrid.collapsedHeight
24 collapsedHeight: filterGrid.collapsedHeight
25− margins: filterGrid.margins
26 uncollapsedHeight: filterGrid.uncollapsedHeight
25 uncollapsedHeight: filterGrid.uncollapsedHeight
27 originY: filterGrid.originY
26 originY: filterGrid.originY
28− verticalSpacing: units.gu(1)
29− currentItem: filterGrid.currentItem
30 height: filterGrid.height
27 height: filterGrid.height
31 filtered: filterGrid.filtered
28 filtered: filterGrid.filtered
32
29
@@ -40,7 +37,7 @@ DashRenderer {
40 minimumHorizontalSpacing: units.gu(1)
37 minimumHorizontalSpacing: units.gu(1)
41 delegateWidth: cardTool.cardWidth
38 delegateWidth: cardTool.cardWidth
42 delegateHeight: cardTool.cardHeight
39 delegateHeight: cardTool.cardHeight
43− verticalSpacing: genericFilterGrid.verticalSpacing
40+ verticalSpacing: units.gu(1)
44 model: genericFilterGrid.model
41 model: genericFilterGrid.model
45 collapsedRowCount: Math.min(2, cardTool && cardTool.template && cardTool.template["collapsed-rows"] || 2)
42 collapsedRowCount: Math.min(2, cardTool && cardTool.template && cardTool.template["collapsed-rows"] || 2)
46 displayMarginBeginning: genericFilterGrid.displayMarginBeginning
43 displayMarginBeginning: genericFilterGrid.displayMarginBeginning
qml/Dash/CardVerticalJournal.qml+49−28
@@ -19,42 +19,63 @@ import Ubuntu.Components 0.1
19import "../Components"
19import "../Components"
20
20
21DashRenderer {
21DashRenderer {
22− id: genericVerticalJournal
22+ id: root
23
23
24− property alias minimumColumnSpacing: cardVerticalJournal.minimumColumnSpacing
24+ readonly property double collapseLimit: units.gu(35)
25− property alias maximumNumberOfColumns: cardVerticalJournal.maximumNumberOfColumns
26− property alias columnWidth: cardVerticalJournal.columnWidth
27− property alias rowSpacing: cardVerticalJournal.rowSpacing
28
25
29− anchors.fill: parent
26+ uncollapsedHeight: cardVerticalJournal.implicitHeight
27+ collapsedHeight: Math.min(collapseLimit, cardVerticalJournal.implicitHeight)
28+ expandable: uncollapsedHeight > collapseLimit
29+
30+ // This minHeight is used as bootstrapper for the height. Vertical Journal
31+ // is special by the fact that it doesn't know how to calculate its implicit height unless we give it
32+ // enough height that it can start creating it's children so we make sure it has enough height for that
33+ // in case the model is non empty
34+ readonly property double minHeight: root.model.count > 1 ? cardVerticalJournal.rowSpacing + 1 : 0
35+ height: filtered ? Math.max(collapsedHeight, minHeight) : uncollapsedHeight
36+
37+ Behavior on height {
38+ id: heightBehaviour
39+ animation: UbuntuNumberAnimation { }
40+ }
41+
42+ function setFilter(filter, animate) {
43+ heightBehaviour.enabled = animate;
44+ filtered = filter;
45+ }
30
46
31 ResponsiveVerticalJournal {
47 ResponsiveVerticalJournal {
32 id: cardVerticalJournal
48 id: cardVerticalJournal
49+
50+ model: root.model
51+
33 anchors.fill: parent
52 anchors.fill: parent
34− maximumNumberOfColumns: 2
35− minimumColumnSpacing: units.gu(1)
53+ rowSpacing: minimumColumnSpacing
36− rowSpacing: units.gu(1)
37− model: genericVerticalJournal.model
38−
39− columnWidth: {
54+ columnWidth: cardTool.cardWidth
40− if (genericVerticalJournal.template !== undefined) {
41− switch (genericVerticalJournal.template['card-size']) {
42− case "small": return units.gu(12);
43− case "large": return units.gu(38);
44− }
45− }
46− return units.gu(18.5);
47− }
48
55
49− delegate: Card {
56+ displayMarginBeginning: root.displayMarginBeginning
50− id: card
57+ displayMarginEnd: root.displayMarginEnd
51− objectName: "delegate" + index
52− cardData: model
53− template: genericVerticalJournal.template
54− components: genericVerticalJournal.components
55
58
59+ delegate: Loader {
60+ id: loader
61+ sourceComponent: cardTool.cardComponent
62+ width: cardTool.cardWidth
63+ anchors.horizontalCenter: parent.horizontalCenter
64+ onLoaded: {
65+ item.objectName = "delegate" + index;
66+ item.width = Qt.binding(function() { return cardTool.cardWidth; });
67+ item.height = Qt.binding(function() { return cardTool.cardHeight; });
68+ item.fixedArtShapeSize = Qt.binding(function() { return cardTool.artShapeSize; });
69+ item.cardData = Qt.binding(function() { return model; });
70+ item.template = Qt.binding(function() { return cardTool.template; });
71+ item.components = Qt.binding(function() { return cardTool.components; });
72+ item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
73+ }
74+ Connections {
75+ target: loader.item
56− //onClicked: cardVerticalJournal.clicked(index, tile.y)
76+ onClicked: root.clicked(index, result)
57− //onPressAndHold: cardVerticalJournal.pressAndHold(index, tile.y)
77+ onPressAndHold: root.pressAndHold(index)
78+ }
58 }
79 }
59 }
80 }
60}
81}
qml/Dash/DashRenderer.qml−7
@@ -25,8 +25,6 @@ Item {
25
25
26 property int collapsedHeight: height
26 property int collapsedHeight: height
27
27
28− property int margins: 0
29−
30 property int uncollapsedHeight: height
28 property int uncollapsedHeight: height
31
29
32 property int displayMarginBeginning: 0
30 property int displayMarginBeginning: 0
@@ -35,11 +33,6 @@ Item {
35
33
36 property real originY: 0
34 property real originY: 0
37
35
38− property real verticalSpacing: 0
39−
40− // The current item of the renderer
41− property var currentItem
42−
43 // The model to renderer
36 // The model to renderer
44 property var model
37 property var model
45
38