on xenial help sign in
shift flickable contents to avoid scrolling back to the beginning
b5ffd72Michael Zanetti
qml/Stages/PhoneStage.qml+33−22
@@ -192,11 +192,12 @@ Item {
192 priv.requestNewScreenshot();
192 priv.requestNewScreenshot();
193 spreadView.stage = 0;
193 spreadView.stage = 0;
194 attachedToView = true;
194 attachedToView = true;
195+ spreadView.contentX = -spreadView.shift;
195 }
196 }
196 if (dragging && !priv.waitingForScreenshot && attachedToView) {
197 if (dragging && !priv.waitingForScreenshot && attachedToView) {
197− spreadView.contentX = -touchX
198+ spreadView.contentX = -touchX - spreadView.shift
198 }
199 }
199− if (attachedToView && spreadView.contentX >= spreadView.width * spreadView.positionMarker3) {
200+ if (attachedToView && spreadView.shiftedContentX >= spreadView.width * spreadView.positionMarker3) {
200 attachedToView = false;
201 attachedToView = false;
201 spreadView.snap();
202 spreadView.snap();
202 }
203 }
@@ -240,8 +241,17 @@ Item {
240 Flickable {
241 Flickable {
241 id: spreadView
242 id: spreadView
242 anchors.fill: parent
243 anchors.fill: parent
243− visible: contentX > 0
244+ visible: spreadDragArea.dragging || stage > 0 || snapAnimation.running
244− contentWidth: spreadRow.width
245+ contentWidth: spreadRow.width - shift
246+ contentX: -shift
247+
248+ // The flickable needs to fill the screen in order to get touch events all over.
249+ // However, we don't want to the user to be able to scroll back all the way. For
250+ // that, the beginning of the gesture starts with a negative value for contentX
251+ // so the flickable wants to pull it into the view already. "shift" tunes the
252+ // distance where to "lock" the content.
253+ property real shift: width / 2
254+ property real shiftedContentX: contentX + shift
245
255
246 property int tileDistance: width / 4
256 property int tileDistance: width / 4
247
257
@@ -266,46 +276,46 @@ Item {
266 onContentXChanged: {
276 onContentXChanged: {
267 switch (stage) {
277 switch (stage) {
268 case 0:
278 case 0:
269− if (contentX > width * positionMarker2) {
279+ if (shiftedContentX > width * positionMarker2) {
270 stage = 1;
280 stage = 1;
271 }
281 }
272 break;
282 break;
273 case 1:
283 case 1:
274− if (contentX < width * positionMarker2) {
284+ if (shiftedContentX < width * positionMarker2) {
275 stage = 0;
285 stage = 0;
276− } else if (contentX >= width * positionMarker4) {
286+ } else if (shiftedContentX >= width * positionMarker4) {
277 stage = 2;
287 stage = 2;
278 }
288 }
279 }
289 }
280 }
290 }
281
291
282 function snap() {
292 function snap() {
283− if (contentX < positionMarker1 * width) {
293+ if (shiftedContentX < positionMarker1 * width) {
284− snapAnimation.targetContentX = 0;
294+ snapAnimation.targetContentX = -shift;
285 snapAnimation.start();
295 snapAnimation.start();
286− } else if (contentX < positionMarker2 * width) {
296+ } else if (shiftedContentX < positionMarker2 * width) {
287 print("selecting tile 1")
297 print("selecting tile 1")
288 snapTo(1)
298 snapTo(1)
289− } else if (contentX < positionMarker3 * width) {
299+ } else if (shiftedContentX < positionMarker3 * width) {
290 print("snappoing to stage1")
300 print("snappoing to stage1")
291 snapTo(1)
301 snapTo(1)
292 } else if (stage < 2){
302 } else if (stage < 2){
293 print("snappoing to stage2")
303 print("snappoing to stage2")
294 // Add 1 pixel to make sure we definitely hit positionMarker4 even with rounding errors of the animation.
304 // Add 1 pixel to make sure we definitely hit positionMarker4 even with rounding errors of the animation.
295− snapAnimation.targetContentX = width * positionMarker4 + 1;
305+ snapAnimation.targetContentX = width * positionMarker4 + 1 - shift;
296 snapAnimation.start();
306 snapAnimation.start();
297 }
307 }
298 }
308 }
299 function snapTo(index) {
309 function snapTo(index) {
300 spreadView.selectedIndex = index;
310 spreadView.selectedIndex = index;
301
311
302− snapAnimation.targetContentX = 0;
312+ snapAnimation.targetContentX = -shift;
303 snapAnimation.start();
313 snapAnimation.start();
304 }
314 }
305
315
306 SequentialAnimation {
316 SequentialAnimation {
307 id: snapAnimation
317 id: snapAnimation
308− property int targetContentX: 0
318+ property int targetContentX: -shift
309
319
310 UbuntuNumberAnimation {
320 UbuntuNumberAnimation {
311 target: spreadView
321 target: spreadView
@@ -316,17 +326,18 @@ Item {
316 }
326 }
317 ScriptAction {
327 ScriptAction {
318 script: {
328 script: {
319− print("animation finished: stage", spreadView.stage, "contentX", spreadView.contentX, "focused app", ApplicationManager.get(0).appId, ApplicationManager.get(1).appId)
329+// print("animation finished: stage", spreadView.stage, "contentX", spreadView.contentX, "focused app", ApplicationManager.get(0).appId, ApplicationManager.get(1).appId)
320 if (spreadView.selectedIndex >= 0) {
330 if (spreadView.selectedIndex >= 0) {
321 print("switching to app", snapAnimation.toIndex, ApplicationManager.get(spreadView.selectedIndex).name)
331 print("switching to app", snapAnimation.toIndex, ApplicationManager.get(spreadView.selectedIndex).name)
322 ApplicationManager.focusApplication(ApplicationManager.get(spreadView.selectedIndex).appId);
332 ApplicationManager.focusApplication(ApplicationManager.get(spreadView.selectedIndex).appId);
323 spreadView.selectedIndex = -1
333 spreadView.selectedIndex = -1
324− spreadView.contentX = 0;
334+ spreadView.stage = 0;
335+ spreadView.contentX = -spreadView.shift;
325 }
336 }
326− if (spreadView.contentX == spreadView.width * spreadView.positionMarker2) {
337+ if (spreadView.shiftedContentX == spreadView.width * spreadView.positionMarker2) {
327 spreadView.stage = 4;
338 spreadView.stage = 4;
328 spreadView.stage = 0;
339 spreadView.stage = 0;
329− spreadView.contentX = 0;
340+ spreadView.contentX = -spreadView.shift;
330 }
341 }
331 print("snapping done. stage:", spreadView.stage)
342 print("snapping done. stage:", spreadView.stage)
332 }
343 }
@@ -362,18 +373,18 @@ Item {
362 progress: {
373 progress: {
363 switch (index) {
374 switch (index) {
364 case 0:
375 case 0:
365− return spreadView.contentX / spreadView.width;
376+ return spreadView.shiftedContentX / spreadView.width;
366 case 1:
377 case 1:
367− var progress = spreadView.contentX / spreadView.width;
378+ var progress = spreadView.shiftedContentX / spreadView.width;
368 if (spreadView.stage == 2) {
379 if (spreadView.stage == 2) {
369 progress -= spreadView.tileDistance / spreadView.width;
380 progress -= spreadView.tileDistance / spreadView.width;
370 }
381 }
371− return Math.max(0, progress);
382+ return progress;
372 }
383 }
373 // This delays the progress for all tiles > 1 for the duration of stage 1
384 // This delays the progress for all tiles > 1 for the duration of stage 1
374 var stage1Distance = spreadView.positionMarker2 * spreadView.width;
385 var stage1Distance = spreadView.positionMarker2 * spreadView.width;
375 var tileDistance = (index - 2) * spreadView.tileDistance;
386 var tileDistance = (index - 2) * spreadView.tileDistance;
376− return (spreadView.contentX - stage1Distance - tileDistance) / spreadView.width;
387+ return (spreadView.shiftedContentX - stage1Distance - tileDistance) / spreadView.width;
377 }
388 }
378
389
379 animatedProgress: {
390 animatedProgress: {
qml/Stages/TransformedSpreadDelegate.qml+4−2
@@ -28,7 +28,6 @@ SpreadDelegate {
28 if (selected) {
28 if (selected) {
29 priv.snapshot();
29 priv.snapshot();
30 }
30 }
31− print("setting selected to", selected)
32 priv.isSelected = selected;
31 priv.isSelected = selected;
33 }
32 }
34
33
@@ -88,8 +87,11 @@ SpreadDelegate {
88 }
87 }
89
88
90 property real negativeProgress: {
89 property real negativeProgress: {
91− if (index < 2) {
90+ switch (index) {
91+ case 0:
92 return 0;
92 return 0;
93+ case 1:
94+ return -spreadView.tileDistance / spreadView.width
93 }
95 }
94 return -spreadView.positionMarker2 -(index - 2) * (spreadView.tileDistance / spreadView.width);
96 return -spreadView.positionMarker2 -(index - 2) * (spreadView.tileDistance / spreadView.width);
95 }
97 }