@@ -6,7 +6,6 @@ SpreadDelegate {
66 id: root
77
88 property real progress: 0
9−// onProgressChanged: if (index == 0) print("tile", index, "progress changed:", progress)
109 property real animatedProgress: 0
1110
1211 property real startAngle: 0
@@ -46,83 +45,52 @@ SpreadDelegate {
4645
4746 property real negativeProgress: (index - 1) * spreadView.positionMarker1
4847
48+ function linearAnimation(startProgress, endProgress, startValue, endValue, progress) {
49+ // progress : progressDiff = value : valueDiff
50+ return (progress - startProgress) * (endValue - startValue) / (endProgress - startProgress) + startValue;
51+ }
52+
53+ function easingAnimation(startProgress, endProgress, startValue, endValue, progress) {
54+ helperEasingCurve.progress = progress - startProgress;
55+ helperEasingCurve.period = endProgress - startProgress;
56+ return helperEasingCurve.value * (endValue - startValue) + startValue;
57+ }
4958
5059 property real xTranslate: {
5160 var translation = 0;
5261 switch (index) {
5362 case 0:
5463 if (spreadView.stage == 0) {
55− // Need to compensate the flickable movement (fixing first tile at the left edge)
56− var compensation = root.progress * spreadView.width
57−
58− // Calculating the small movement of the first tile
59− var progress = root.animatedProgress
60− var progressDiff = spreadView.positionMarker2
61− var translateDiff = -spreadView.width * 0.25
62− // progress : progressDiff = translate : translateDiff
63− var movement = progress * translateDiff / progressDiff
64−
65− translation = compensation + movement;
64+ translation = linearAnimation(0, spreadView.positionMarker2, 0, -spreadView.width * .25, root.animatedProgress)
6665 } else if (spreadView.stage == 1){
67− // Need to compensate the flickable movement (fixing first tile at the left edge)
68− var compensation = spreadView.contentX - spreadRow.x
69−
70− // When we start, we need to continue from where state 0 left
71− var stage0Movement = -spreadView.width * 0.25
72−
73− var progress = root.progress - spreadView.positionMarker2
74− var progressDiff = spreadView.positionMarker4 - spreadView.positionMarker2
75− var translateDiff = -stage0Movement;
76−
77− var movement = progress * translateDiff / progressDiff
78−
79− translation = compensation + stage0Movement + movement;
66+ // find where the main easing would be when reaching stage 2
67+ var targetTranslate = easingAnimation(0, spreadView.positionMarker4, 0, -spreadView.width, spreadView.positionMarker4) + spreadView.width
68+ translation = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4, -spreadView.width * .25, targetTranslate, root.progress)
8069 } else { // Stage 2
81− // Move the first tile a bit to the left to be aligned with the others
82− translation += spreadView.contentX - spreadRow.x + spreadView.width
70+// // Move the first tile a bit to the right to be aligned with the others
71+ translation += spreadView.width
8372 // apply the same animation as with the rest
8473 translation += -easingCurve.value * spreadView.width
8574 }
8675 break;
8776 case 1:
8877 if (spreadView.stage == 0) {
89− // Need to compensate the flickable movement (fix it to the right edge)
90− var compensation = root.progress * spreadView.width
91−
92− // Calculate movemoent for the first app coming from the right
93− var progress = root.animatedProgress
94− var progressDiff = spreadView.positionMarker2
95− var translateDiff = -spreadView.width * spreadView.snapPosition
96− // progress : progressDiff = translate : translateDiff
97− var movement = progress * translateDiff / progressDiff
98−
99− translation = compensation + movement;
78+ translation = linearAnimation(0, spreadView.positionMarker2, 0, -spreadView.width * spreadView.snapPosition, root.animatedProgress)
10079 break;
10180 } else if (spreadView.stage == 1) {
102− // Need to compensate the flickable movement (fix it to the right edge)
103− var compensation = root.progress * spreadView.width + spreadView.width/2
104−
105− // Add where stage 0 has moved it to
106− var stage0Movement = -spreadView.width * spreadView.snapPosition;
107−
108− // Calclulate animation between stage0Movement and targetTranslate
109− var progress = root.progress
110− var progressDiff = spreadView.positionMarker4 - spreadView.positionMarker2
111−
112− // find where the main easing would be when reaching positionMarker4
113− helperEasingCurve.progress = progressDiff;
114− var targetTranslate = -helperEasingCurve.value * spreadView.width + root.endDistance
81+// // find where the main easing would be when reaching stage 2
82+ var stage2Progress = spreadView.positionMarker4 - spreadView.tileDistance / spreadView.width;
83+ targetTranslate = easingAnimation(0, stage2Progress, 0, -spreadView.width + root.endDistance, stage2Progress);
11584
116− var translateDiff = targetTranslate - stage0Movement;
117− var movement = progress * translateDiff / progressDiff
85+ translation = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4,
86+ -spreadView.width * spreadView.snapPosition, targetTranslate, root.progress);
11887
119− translation = compensation + stage0Movement + movement;
12088 break;
12189 }
12290
12391 default:
124− // Fix it at the right edge...
125− translation += spreadView.contentX - spreadRow.x - ((index - 1) * root.startDistance)
92+// // Fix it at the right edge...
93+ translation += -((index - 1) * root.startDistance)
12694 // ...and use our easing to move them to the left. Stop a bit earlier for each tile
12795 translation += -easingCurve.value * spreadView.width + (index * root.endDistance)
12896 if (isSelected) {
@@ -149,44 +117,22 @@ SpreadDelegate {
149117 switch (index) {
150118 case 0:
151119 if (spreadView.stage == 0) {
152− var progress = root.animatedProgress;
153− var progressDiff = spreadView.positionMarker2;
154− var angleDiff = root.endAngle * spreadView.snapPosition;
155− // progress : progressDiff = angle : angleDiff
156− newAngle = progress * angleDiff / progressDiff;
120+ newAngle = linearAnimation(0, spreadView.positionMarker2, 0, root.endAngle * spreadView.snapPosition, root.animatedProgress)
157121 break;
158122 } else if (spreadView.stage == 1) {
159− var stage0Angle = root.endAngle * spreadView.snapPosition;
160−
161− var progress = root.progress - spreadView.positionMarker2;
162− var angleDiff = root.endAngle;
163− var progressDiff = 1 - spreadView.positionMarker2;
164− var angleTransform = progress * angleDiff / progressDiff;
165− newAngle = stage0Angle + angleTransform;
166− newAngle = Math.min(root.endAngle, newAngle);
123+ newAngle = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4, root.endAngle * spreadView.snapPosition, root.endAngle, root.progress)
167124 break;
168125 }
169126 case 1:
170127 if (spreadView.stage == 0) {
171− var progress = root.animatedProgress;
172− var progressDiff = spreadView.positionMarker2;
173− var angleDiff = root.startAngle * spreadView.snapPosition
174−
175− // progress : progressDiff = angle : angleDiff
176− var angleTranslate = progress * angleDiff / progressDiff;
177−
178− newAngle = root.startAngle - angleTranslate;
128+ newAngle = linearAnimation(0, spreadView.positionMarker2, root.startAngle, root.startAngle * (1-spreadView.snapPosition), root.animatedProgress)
179129 break;
180130 } else if (spreadView.stage == 1) {
181− var stage0Angle = root.startAngle - (root.startAngle * spreadView.snapPosition)
182−
183− var progress = root.progress
184− var progressDiff = spreadView.positionMarker4 - spreadView.positionMarker2
185− var angleDiff = root.endAngle - stage0Angle;
131+ // find where the main easing would be when reaching stage 2
132+ helperEasingCurve.progress = spreadView.positionMarker4 - spreadView.tileDistance / spreadView.width;
133+ var targetAngle = root.startAngle - helperEasingCurve.value * (root.startAngle - root.endAngle)
186134
187− // progress : progressDiff = angle : angleDiff
188− var angleTranslate = progress * angleDiff / progressDiff;
189− newAngle = stage0Angle + angleTranslate;
135+ newAngle = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4, root.startAngle * (1-spreadView.snapPosition), targetAngle, root.progress)
190136 break;
191137 }
192138
@@ -213,40 +159,20 @@ SpreadDelegate {
213159 newScale = 1;
214160 break
215161 } else if(spreadView.stage == 1) {
216− var progress = root.progress - spreadView.positionMarker2
217− var progressDiff = spreadView.positionMarker4 - spreadView.positionMarker2
218− var scaleDiff = 1 - root.endScale;
219− // progress : progressDiff = angle : angleDiff
220− newScale = 1 - (progress * scaleDiff / progressDiff);
162+ newScale = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4, 1, root.endScale, root.progress)
221163 break;
222164 }
223165 case 1:
224166 if (spreadView.stage == 0) {
225− var progress = root.animatedProgress;
226− var progressDiff = spreadView.positionMarker2;
227− var scaleDiff = (root.tile1StartScale - 1) * spreadView.snapPosition
228−
229− // progress : progressDiff = angle : angleDiff
230− var scaleTranslate = progress * scaleDiff / progressDiff;
231−
232− newScale = root.tile1StartScale - scaleTranslate;
167+ newScale = linearAnimation(0, spreadView.positionMarker2, root.tile1StartScale, 1, root.animatedProgress)
233168 break;
234169 } else if (spreadView.stage == 1) {
235− var stage0Scale = root.tile1StartScale - (root.tile1StartScale - 1) * spreadView.snapPosition
236−
237− var progress = root.progress
238− var progressDiff = spreadView.positionMarker4 - spreadView.positionMarker2
239−
240− // find where the main easing would be when reaching positionMarker4
241− helperEasingCurve.progress = progressDiff;
242− var targetScale = root.startScale - helperEasingCurve.value * (root.startScale - root.endScale)
243−
244− var scaleDiff = stage0Scale - targetScale;
245−
246− // progress : progressDiff = angle : angleDiff
247− var scaleTranslate = progress * scaleDiff / progressDiff;
248−
249− return stage0Scale - scaleTranslate;
170+// // find where the main easing would be when reaching positionMarker4
171+// helperEasingCurve.progress = spreadView.positionMarker4;
172+// var targetScale = root.startScale - helperEasingCurve.value * (root.startScale - root.endScale)
173+ var targetScale = easingAnimation(0, spreadView.positionMarker4, root.startScale, root.endScale, spreadView.positionMarker4);
174+ newScale = linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4, 1, targetScale, root.progress)
175+ break;
250176 }
251177
252178 default: