git.iko.soy/unity8
on xenial help sign in
Animate the growing of height if on screen
commitd90fbf7581ef0a8c90ff1ac59a180945e436fb78 authorAlbert Astals <albert.astals@canonical.com> dateTue 13 Aug 2013, 16:50 (13 years ago) parentf449665
3 files changed+53−6
compare with xenial
unifiedsplit
Components/FilterGrid.qml+27−2 Components/ResponsiveGridView.qml+7−1 Dash/GenericScopeView.qml+19−3
Components/FilterGrid.qml+27−2
@@ -41,6 +41,12 @@ Item {
4141
4242 /* Maximum number of rows to be show when filter=true. */
4343 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+ }
4450
4551 property alias minimumHorizontalSpacing: iconTileGrid.minimumHorizontalSpacing
4652 property alias maximumNumberOfColumns: iconTileGrid.maximumNumberOfColumns
@@ -55,7 +61,26 @@ Item {
5561 readonly property alias moving: iconTileGrid.moving
5662 readonly property alias pressDelay: iconTileGrid.pressDelay
5763
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+ }
5984
6085 ResponsiveGridView {
6186 id: iconTileGrid
@@ -72,7 +97,7 @@ Item {
7297
7398 model: LimitProxyModel {
7499 model: root.model
75− limit: (filter) ? collapsedRowCount * iconTileGrid.columns : -1
100+ limit: (filter && !filterAnimation.running) ? collapsedRowCount * iconTileGrid.columns : -1
76101 }
77102
78103 }
Components/ResponsiveGridView.qml+7−1
@@ -32,12 +32,18 @@ Item {
3232 property alias delegate: gridView.delegate
3333 readonly property int cellWidth: gridView.cellWidth
3434 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+ }
3638 property alias interactive: gridView.interactive
3739 readonly property alias flicking: gridView.flicking
3840 readonly property alias moving: gridView.moving
3941 readonly property alias pressDelay: gridView.pressDelay
4042
43+ function contentHeightForRows(rows) {
44+ return rows * cellHeight + verticalSpacing
45+ }
46+
4147 GridView {
4248 id: gridView
4349 objectName: "responsiveGridViewGrid"
Dash/GenericScopeView.qml+19−3
@@ -73,9 +73,6 @@ ScopeView {
7373
7474 onLoaded: {
7575 item.model = results
76− if (item.expandable) {
77− item.filter = Qt.binding(function() { return index != categoryView.expandedIndex; });
78− }
7976 }
8077
8178 Connections {
@@ -110,6 +107,25 @@ ScopeView {
110107 }
111108 }
112109 }
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+ }
113129 }
114130 }
115131