git.iko.soy/unity8
on xenial help sign in
Animate the growing of height if on screen
d90fbf7Albert Astals
Components/FilterGrid.qml+27−2
compare with xenial
unifiedsplit
@@ -41,6 +41,12 @@ Item {
41
41
42 /* Maximum number of rows to be show when filter=true. */
42 /* Maximum number of rows to be show when filter=true. */
43 property int collapsedRowCount: 2
43 property int collapsedRowCount: 2
44+ readonly property int collapsedHeight: {
45+ return iconTileGrid.contentHeightForRows(Math.min(collapsedRowCount, Math.ceil(model.count / columns))) //
46+ }
47+ readonly property int uncollapsedHeight: {
48+ return iconTileGrid.contentHeightForRows(Math.ceil(model.count / columns)) //
49+ }
44
50
45 property alias minimumHorizontalSpacing: iconTileGrid.minimumHorizontalSpacing
51 property alias minimumHorizontalSpacing: iconTileGrid.minimumHorizontalSpacing
46 property alias maximumNumberOfColumns: iconTileGrid.maximumNumberOfColumns
52 property alias maximumNumberOfColumns: iconTileGrid.maximumNumberOfColumns
@@ -55,7 +61,26 @@ Item {
55 readonly property alias moving: iconTileGrid.moving
61 readonly property alias moving: iconTileGrid.moving
56 readonly property alias pressDelay: iconTileGrid.pressDelay
62 readonly property alias pressDelay: iconTileGrid.pressDelay
57
63
58− height: childrenRect.height
64+ height: !filterAnimation.running ? childrenRect.height : height
65+ clip: filterAnimation.running
66+
67+ NumberAnimation {
68+ property bool filterEndValue
69+ id: filterAnimation
70+ target: root
71+ property: "height"
72+ duration: 200
73+ to: filterEndValue ? root.collapsedHeight : root.uncollapsedHeight
74+ easing.type: Easing.InOutQuad
75+ onStopped: {
76+ root.filter = filterEndValue;
77+ }
78+ }
79+
80+ function startFilterAnimation(filter) {
81+ filterAnimation.filterEndValue = filter
82+ filterAnimation.start();
83+ }
59
84
60 ResponsiveGridView {
85 ResponsiveGridView {
61 id: iconTileGrid
86 id: iconTileGrid
@@ -72,7 +97,7 @@ Item {
72
97
73 model: LimitProxyModel {
98 model: LimitProxyModel {
74 model: root.model
99 model: root.model
75− limit: (filter) ? collapsedRowCount * iconTileGrid.columns : -1
100+ limit: (filter && !filterAnimation.running) ? collapsedRowCount * iconTileGrid.columns : -1
76 }
101 }
77
102
78 }
103 }
Components/ResponsiveGridView.qml+7−1
@@ -32,12 +32,18 @@ Item {
32 property alias delegate: gridView.delegate
32 property alias delegate: gridView.delegate
33 readonly property int cellWidth: gridView.cellWidth
33 readonly property int cellWidth: gridView.cellWidth
34 readonly property int cellHeight: gridView.cellHeight
34 readonly property int cellHeight: gridView.cellHeight
35− readonly property int totalContentHeight: Math.ceil(gridView.model.count / columns) * cellHeight + verticalSpacing
35+ readonly property int totalContentHeight: {
36+ return contentHeightForRows(Math.ceil(gridView.model.count / columns))
37+ }
36 property alias interactive: gridView.interactive
38 property alias interactive: gridView.interactive
37 readonly property alias flicking: gridView.flicking
39 readonly property alias flicking: gridView.flicking
38 readonly property alias moving: gridView.moving
40 readonly property alias moving: gridView.moving
39 readonly property alias pressDelay: gridView.pressDelay
41 readonly property alias pressDelay: gridView.pressDelay
40
42
43+ function contentHeightForRows(rows) {
44+ return rows * cellHeight + verticalSpacing
45+ }
46+
41 GridView {
47 GridView {
42 id: gridView
48 id: gridView
43 objectName: "responsiveGridViewGrid"
49 objectName: "responsiveGridViewGrid"
Dash/GenericScopeView.qml+19−3
@@ -73,9 +73,6 @@ ScopeView {
73
73
74 onLoaded: {
74 onLoaded: {
75 item.model = results
75 item.model = results
76− if (item.expandable) {
77− item.filter = Qt.binding(function() { return index != categoryView.expandedIndex; });
78− }
79 }
76 }
80
77
81 Connections {
78 Connections {
@@ -110,6 +107,25 @@ ScopeView {
110 }
107 }
111 }
108 }
112 }
109 }
110+ Connections {
111+ target: categoryView
112+ onExpandedIndexChanged: {
113+ var item = rendererLoader.item;
114+ if (item.expandable) {
115+ var shouldFilter = index != categoryView.expandedIndex;
116+ if (shouldFilter != item.filter) {
117+ // If the filter animation will be seen start it, otherwise, just flip the switch
118+ var shrinkingVisible = shouldFilter && y + item.collapsedHeight < categoryView.height;
119+ var growingVisible = !shouldFilter && y + height < categoryView.height;
120+ if (shrinkingVisible || growingVisible) {
121+ item.startFilterAnimation(shouldFilter)
122+ } else {
123+ item.filter = shouldFilter;
124+ }
125+ }
126+ }
127+ }
128+ }
113 }
129 }
114 }
130 }
115
131