on xenial help sign in
fixed expansion
4340082Nick Dedekind
qml/Panel/IndicatorsBar.qml+65−109
@@ -50,25 +50,21 @@ Item {
50 row.setCurrentItemIndex(index);
50 row.setCurrentItemIndex(index);
51 }
51 }
52
52
53− function alignIndicatorsToLeft() {
53+ function alignIndicators() {
54− alignmentTimer.start()
54+ alignmentTimer.start();
55 }
55 }
56
56
57 function addScrollOffset(scrollAmmout) {
57 function addScrollOffset(scrollAmmout) {
58− var proposedScrollOffset = d.scrollOffset + scrollAmmout;
58+ if (scrollAmmout < 0) { // left scroll
59− var proposedCombinedOffset = d.combinedOffset - scrollAmmout;
59+ if (flickable.contentX < 0) return; // already off the left.
60−
60+ if (flickable.contentX + scrollAmmout < 0) scrollAmmout = -flickable.contentX; // going to be off the left
61− if (scrollAmmout < 0 && d.combinedOffset > (row.width - rowContainer.width)) return;
61+ } else { // right scroll
62−
62+ if (flickable.contentX + flickable.width > row.width) return; // already off the right.
63− if (scrollAmmout > 0 && proposedCombinedOffset < 0) {
63+ if (flickable.contentX + flickable.width + scrollAmmout > row.width) { // going to be off the right
64− // get the combined offset back to 0
64+ scrollAmmout = row.width - (flickable.contentX + flickable.width);
65− proposedScrollOffset = proposedScrollOffset + proposedCombinedOffset;
65+ }
66− } else if (scrollAmmout < 0 && proposedCombinedOffset > row.width - rowContainer.width) {
67− // get the combined offset back to max
68− proposedScrollOffset = proposedScrollOffset + (proposedCombinedOffset - (row.width - rowContainer.width));
69 }
66 }
70−
67+ d.scrollOffset = d.scrollOffset + scrollAmmout;
71− d.scrollOffset = proposedScrollOffset;
72 }
68 }
73
69
74 QtObject {
70 QtObject {
@@ -76,7 +72,6 @@ Item {
76 property var initialItem
72 property var initialItem
77 // the non-expanded distance from row offset to center of initial item
73 // the non-expanded distance from row offset to center of initial item
78 property real originalDistanceFromRight: -1
74 property real originalDistanceFromRight: -1
79− property real originalItemWidth: -1
80
75
81 // calculate the distance from row offset to center of initial item
76 // calculate the distance from row offset to center of initial item
82 property real distanceFromRight: {
77 property real distanceFromRight: {
@@ -87,37 +82,19 @@ Item {
87
82
88 // offset to the intially selected expanded item
83 // offset to the intially selected expanded item
89 property real rowOffset: 0
84 property real rowOffset: 0
90− property real alignmentAdjustment: 0
91 property real scrollOffset: 0
85 property real scrollOffset: 0
92− property real combinedOffset: rowOffset + alignmentAdjustment - scrollOffset
86+ property real alignmentAdjustment: 0
87+ property real combinedOffset: 0
93
88
94 // when the scroll offset changes, we need to reclaculate the relative lateral position
89 // when the scroll offset changes, we need to reclaculate the relative lateral position
95 onScrollOffsetChanged: root.lateralPositionChanged()
90 onScrollOffsetChanged: root.lateralPositionChanged()
96
91
97 onInitialItemChanged: {
92 onInitialItemChanged: {
98− if (initialItem) {
99− originalItemWidth = initialItem.width;
100− originalDistanceFromRight = row.width - initialItem.x - initialItem.width/2;
93+ originalDistanceFromRight = initialItem ? (row.width - initialItem.x - initialItem.width/2) : -1;
101− } else {
102− originalItemWidth = -1;
103− originalDistanceFromRight = -1;
104− }
105 }
94 }
106
95
107 Behavior on alignmentAdjustment {
96 Behavior on alignmentAdjustment {
108− NumberAnimation { duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing}
97+ NumberAnimation { duration: UbuntuAnimation.BriskDuration; easing: UbuntuAnimation.StandardEasing}
109− }
110− }
111−
112− onExpandedChanged: {
113− if (!expanded) flickable.moved = false;
114− }
115−
116− Connections {
117− target: row
118− onCurrentItemChanged: {
119− if (!row.currentItem) d.initialItem = undefined;
120− else if (!d.initialItem) d.initialItem = row.currentItem;
121 }
98 }
122 }
99 }
123
100
@@ -137,34 +114,15 @@ Item {
137 anchors.fill: parent
114 anchors.fill: parent
138 clip: expanded || row.width > rowContainer.width
115 clip: expanded || row.width > rowContainer.width
139
116
140− IndicatorItemRow {
141− id: row
142− objectName: "indicatorItemRow"
143− anchors {
144− top: parent.top
145− bottom: parent.bottom
146− right: parent.right
147− rightMargin: -d.combinedOffset
148− }
149−
150− lateralPosition: {
151− if (root.lateralPosition == -1) return -1;
152−
153− var mapped = root.mapToItem(row, root.lateralPosition, 0);
154− return Math.min(Math.max(mapped.x, 0), row.width);
155− }
156− }
157−
158 Flickable {
117 Flickable {
159 id: flickable
118 id: flickable
119+ objectName: "flickable"
120+
160 anchors.fill: parent
121 anchors.fill: parent
161 contentWidth: row.width
122 contentWidth: row.width
162 interactive: root.expanded
123 interactive: root.expanded
163−
124+ // align right + offset from row selection + scrolling
164− property bool moved: false
125+ contentX: row.width - flickable.width - d.combinedOffset
165− onMovingChanged: {
166− moved = true;
167− }
168
126
169 rebound: Transition {
127 rebound: Transition {
170 NumberAnimation {
128 NumberAnimation {
@@ -174,21 +132,46 @@ Item {
174 }
132 }
175 }
133 }
176
134
135+ IndicatorItemRow {
136+ id: row
137+ objectName: "indicatorItemRow"
138+ anchors {
139+ top: parent.top
140+ bottom: parent.bottom
141+ }
142+
143+ lateralPosition: {
144+ if (root.lateralPosition == -1) return -1;
145+
146+ var mapped = root.mapToItem(row, root.lateralPosition, 0);
147+ return Math.min(Math.max(mapped.x, 0), row.width);
148+ }
149+
150+ onCurrentItemChanged: {
151+ if (!currentItem) d.initialItem = undefined;
152+ else if (!d.initialItem) d.initialItem = currentItem;
153+ }
154+
177− MouseArea {
155+ MouseArea {
178− anchors.fill: parent
156+ anchors.fill: parent
179− enabled: root.expanded
157+ enabled: root.expanded
158+ onClicked: {
180− onClicked: row.selectItemAt(mouse.x);
159+ row.selectItemAt(mouse.x);
160+ alignIndicators();
161+ }
162+ }
181 }
163 }
164+
182 }
165 }
183 }
166 }
184
167
185 Timer {
168 Timer {
186 id: alignmentTimer
169 id: alignmentTimer
187− interval: UbuntuAnimation.SnapDuration // enough for row animation.
170+ interval: UbuntuAnimation.FastDuration // enough for row animation.
188 repeat: false
171 repeat: false
189 onTriggered: {
172 onTriggered: {
190− if (expanded && row.x > 0) {
173+ if (expanded && !flickable.moving && row.width > flickable.width && flickable.contentX < 0) { // off the left.
191− d.alignmentAdjustment = -row.x;
174+ d.alignmentAdjustment += flickable.contentX;
192 }
175 }
193 }
176 }
194 }
177 }
@@ -200,14 +183,19 @@ Item {
200 PropertyChanges {
183 PropertyChanges {
201 target: d
184 target: d
202 rowOffset: 0
185 rowOffset: 0
203− alignmentAdjustment: 0
204 scrollOffset: 0
186 scrollOffset: 0
187+ alignmentAdjustment: 0
205 restoreEntryValues: false
188 restoreEntryValues: false
206 }
189 }
207 },
190 },
208 State {
191 State {
209 name: "expanded"
192 name: "expanded"
210− when: expanded && !flickable.moved
193+ when: expanded
194+
195+ PropertyChanges {
196+ target: d
197+ combinedOffset: rowOffset + alignmentAdjustment - scrollOffset
198+ }
211
199
212 PropertyChanges {
200 PropertyChanges {
213 target: d
201 target: d
@@ -216,34 +204,10 @@ Item {
216 if (distanceFromRight - initialItem.width <= 0) return 0;
204 if (distanceFromRight - initialItem.width <= 0) return 0;
217
205
218 var rowOffset = distanceFromRight - originalDistanceFromRight;
206 var rowOffset = distanceFromRight - originalDistanceFromRight;
219− if (originalDistanceFromRight + originalItemWidth/2 > rowContainer.width) {
220− rowOffset = rowOffset + originalItemWidth;
221− }
222 return rowOffset;
207 return rowOffset;
223 }
208 }
224− }
225− // keep flickable inline with row
226− PropertyChanges {
227− target: flickable
228− contentX: (flickable.contentWidth - flickable.width) - d.combinedOffset
229 restoreEntryValues: false
209 restoreEntryValues: false
230 }
210 }
231− },
232− State {
233− name: "moved"
234− when: expanded && flickable.moved
235−
236− StateChangeScript {
237− script: {
238− // unbind contentX
239− flickable.contentX = flickable.contentX;
240− d.scrollOffset = 0;
241− }
242− }
243− PropertyChanges {
244− target: row
245− anchors.rightMargin: - (flickable.contentWidth - flickable.width) + (flickable.contentX) + d.scrollOffset
246− }
247 }
211 }
248 ]
212 ]
249
213
@@ -251,25 +215,17 @@ Item {
251 Transition {
215 Transition {
252 from: "expanded"
216 from: "expanded"
253 to: "minimized"
217 to: "minimized"
218+ PropertyAction {
219+ target: d
220+ properties: "rowOffset, scrollOffset, alignmentAdjustment"
221+ value: 0
222+ }
254 PropertyAnimation {
223 PropertyAnimation {
255− target: d;
224+ target: d
256− properties: "rowOffset, scrollOffset"
225+ properties: "combinedOffset"
257 duration: UbuntuAnimation.SnapDuration
226 duration: UbuntuAnimation.SnapDuration
258 easing: UbuntuAnimation.StandardEasing
227 easing: UbuntuAnimation.StandardEasing
259 }
228 }
260− },
261− Transition {
262− from: "moved"
263− to: "minimized"
264− SequentialAnimation {
265− PropertyAction { target: d; properties: "rowOffset, alignmentAdjustment, scrollOffset" }
266− PropertyAnimation {
267− target: row;
268− properties: "anchors.rightMargin"
269− duration: UbuntuAnimation.SnapDuration
270− easing: UbuntuAnimation.StandardEasing
271− }
272− }
273 }
229 }
274 ]
230 ]
275}
231}
qml/Panel/IndicatorsMenu.qml+3−3
@@ -139,7 +139,7 @@ Showable {
139
139
140 ScrollCalculator {
140 ScrollCalculator {
141 id: leftScroller
141 id: leftScroller
142− width: units.gu(5)
142+ width: units.gu(2)//units.gu(5)
143 anchors.left: bar.left
143 anchors.left: bar.left
144 height: bar.height
144 height: bar.height
145
145
@@ -153,7 +153,7 @@ Showable {
153
153
154 ScrollCalculator {
154 ScrollCalculator {
155 id: rightScroller
155 id: rightScroller
156− width: units.gu(5)
156+ width: units.gu(2)//units.gu(5)
157 anchors.right: bar.right
157 anchors.right: bar.right
158 height: bar.height
158 height: bar.height
159
159
@@ -209,7 +209,7 @@ Showable {
209 onRunningChanged: {
209 onRunningChanged: {
210 if (showAnimation.running) {
210 if (showAnimation.running) {
211 root.state = "commit";
211 root.state = "commit";
212− bar.alignIndicatorsToLeft();
212+ bar.alignIndicators();
213 }
213 }
214 }
214 }
215 }
215 }
tests/qmltests/Panel/tst_IndicatorsMenu.qml+18−3
@@ -53,9 +53,6 @@ IndicatorTest {
53 openedHeight: parent.height
53 openedHeight: parent.height
54 indicatorsModel: root.indicatorsModel
54 indicatorsModel: root.indicatorsModel
55 shown: false
55 shown: false
56−
57− // no vertical movement allowed while dragging
58− verticalVelocityThreashold: 0
59 }
56 }
60 }
57 }
61
58
@@ -103,6 +100,8 @@ IndicatorTest {
103 indicatorsMenu.hide();
100 indicatorsMenu.hide();
104 tryCompare(indicatorsMenu.hideAnimation, "running", false);
101 tryCompare(indicatorsMenu.hideAnimation, "running", false);
105 compare(indicatorsMenu.state, "initial");
102 compare(indicatorsMenu.state, "initial");
103+
104+ indicatorsMenu.verticalVelocityThreashold = 0.5
106 }
105 }
107
106
108 function get_indicator_item(index) {
107 function get_indicator_item(index) {
@@ -121,6 +120,21 @@ IndicatorTest {
121 tryCompare(indicatorsMenu, "fullyClosed", true);
120 tryCompare(indicatorsMenu, "fullyClosed", true);
122 }
121 }
123
122
123+ // Test that closing the indicators ends up in the correct position.
124+ function test_hideEndsInCorrectPosition() {
125+ var indicatorsBar = findChild(indicatorsMenu, "indicatorsBar");
126+ var flickable = findChild(indicatorsBar, "flickable");
127+
128+ var originalContentX = flickable.contentX;
129+
130+ indicatorsMenu.show();
131+ indicatorsBar.setCurrentItemIndex(0);
132+ tryCompare(indicatorsMenu, "fullyOpened", true);
133+
134+ indicatorsMenu.hide();
135+ tryCompare(flickable, "contentX", originalContentX);
136+ }
137+
124 function test_progress_changes_state_to_reveal() {
138 function test_progress_changes_state_to_reveal() {
125 indicatorsMenu.height = indicatorsMenu.openedHeight / 2;
139 indicatorsMenu.height = indicatorsMenu.openedHeight / 2;
126 compare(indicatorsMenu.state, "reveal", "Indicators should be revealing when partially opened.");
140 compare(indicatorsMenu.state, "reveal", "Indicators should be revealing when partially opened.");
@@ -194,6 +208,7 @@ IndicatorTest {
194 // If the vertical velocity is above a specific point, we shouldnt change active indicators
208 // If the vertical velocity is above a specific point, we shouldnt change active indicators
195 // if the x position changes
209 // if the x position changes
196 function test_verticalVelocityDetector() {
210 function test_verticalVelocityDetector() {
211+ indicatorsMenu.verticalVelocityThreashold = 0;
197 verify(indicatorsModel.originalModelData.length >= 2);
212 verify(indicatorsModel.originalModelData.length >= 2);
198
213
199 var indicatorItemRow = findChild(indicatorsMenu, "indicatorItemRow");
214 var indicatorItemRow = findChild(indicatorsMenu, "indicatorItemRow");