@@ -1,16 +1,8 @@
1import QtQuick 2.2
1import QtQuick 2.2
2import Ubuntu.Components 1.1
2import Ubuntu.Components 1.1
3import Utils 0.1
3import Utils 0.1
4−import Unity.Application 0.1
9− anchors {left: parent.left; top: parent.top }
10− text: "prog:" + transitionCurve.progress.toFixed(2)
11− color: leftFoldingAreaProgress > 0 || rightFoldingAreaProgress > 0 ? "red" : "black"
15 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
7 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
@@ -26,81 +18,95 @@ Item {
26 // Spread properties
18 // Spread properties
27 property real spreadHeight: units.gu(10)
19 property real spreadHeight: units.gu(10)
28 property int spreadBottomOffset: units.gu(5)
20 property int spreadBottomOffset: units.gu(5)
29− property int foldingAreaWidth: units.gu(10)
21+ property int foldingAreaWidth: units.gu(20)
30− property int maxVisibleItems: 10
22+ property int maxVisibleItems: 7
31 property int margins: units.gu(5)
23 property int margins: units.gu(5)
32 property real stackScale: 0.04
24 property real stackScale: 0.04
33 property int leftEndFoldedAngle: 70
25 property int leftEndFoldedAngle: 70
34 property int rightEndFoldedAngle: 65
26 property int rightEndFoldedAngle: 65
35 property int unfoldedAngle: 30
27 property int unfoldedAngle: 30
28+ property int stackWidth: units.gu(1)
38 // Internal
31 // Internal
39 readonly property int flickableWidth: flickable ? flickable.width : 0
32 readonly property int flickableWidth: flickable ? flickable.width : 0
40 readonly property int flickableContentWidth: flickable ? flickable.contentWidth: 0
33 readonly property int flickableContentWidth: flickable ? flickable.contentWidth: 0
41 readonly property real flickableProgress: flickable ? flickable.contentX / (flickable.contentWidth - flickableWidth) : 0
34 readonly property real flickableProgress: flickable ? flickable.contentX / (flickable.contentWidth - flickableWidth) : 0
42− // We require the full flickable progress going from 0 to 1 so the user can drag/overshoot tiles in both directions
43− // 0 => all the tiles are stacked up on the right edge
44− // 1 => all the tiles are stacked up on the left edge
45− // However, we also want to restrict tiles to start/end distributed across the screen, so let's adjust the
46− // progress to work on a smaller area => trim progress on left and right by progressAdjust
47− // TODO: 2.6 is a value figured by try&error. Is there a way we can calculate it?
48− readonly property real progressAdjust: (2.6 / ApplicationManager.count)
49− readonly property real adjustedProgress: (flickableProgress * (1-2*progressAdjust)) + progressAdjust
52 readonly property int contentWidth: flickableWidth - root.margins * 2
36 readonly property int contentWidth: flickableWidth - root.margins * 2
54− readonly property int unfoldedDistance: (contentWidth - foldingAreaWidth) / maxVisibleItems
56− readonly property real progressSlice: 1 / totalItems;
57− readonly property real startProgress: (index - maxVisibleItems/2) * progressSlice
58− readonly property real endProgress: (index + maxVisibleItems/2) * progressSlice
60− readonly property real startX: contentWidth - foldingAreaWidth + (startLayout.value * foldingAreaWidth)
61− readonly property real endX: margins + foldingAreaWidth - (endLayout.value * foldingAreaWidth)
63− readonly property int animatedX: transitionCurve.value * (endX - startX) + startX
65 // The y offset we need to add because of scaled tiles in the stacks
38 // The y offset we need to add because of scaled tiles in the stacks
66 readonly property int yOffset: -spreadHeight * stackScale / 2
39 readonly property int yOffset: -spreadHeight * stackScale / 2
41+ readonly property int distance: (flickableContentWidth - (margins * 2) - (foldingAreaWidth * 2)) / totalItems
42+ readonly property int startPos: margins + foldingAreaWidth + itemIndex * distance
43+ readonly property int linearX: startPos - flickableProgress * (flickableContentWidth - flickableWidth)
45+ readonly property int leftFoldingAreaX: margins + foldingAreaWidth
46+ readonly property int rightFoldingAreaX: flickableWidth - foldingAreaWidth - margins
48+ readonly property real leftFoldingAreaProgress: linearAnimation(leftFoldingAreaX, margins, 0, 1, linearX)
49+ readonly property real rightFoldingAreaProgress: linearAnimation(rightFoldingAreaX, flickableWidth - margins, 0, 1, linearX)
51+ readonly property real limitedLeftProgress: Math.min(2, leftFoldingAreaProgress)
52+ readonly property real limitedRightProgress: Math.min(2, rightFoldingAreaProgress)
55+ readonly property int animatedX: {
56+ if (leftFoldingAreaProgress > 4) {
59+ if (leftFoldingAreaProgress > 2) {
60+ return linearAnimation(2, 4, margins + stackWidth, margins, leftFoldingAreaProgress)
62+ if (leftFoldingAreaProgress > 0) {
63+ return linearAnimation(0, 1, leftFoldingAreaX, margins + stackWidth, leftEasing.value)
65+ if (rightFoldingAreaProgress > 4) {
66+ return flickableWidth - margins
68+ if (rightFoldingAreaProgress > 2) {
69+ return linearAnimation(2, 4, flickableWidth - margins - stackWidth, flickableWidth - margins, rightFoldingAreaProgress)
72+ if (rightFoldingAreaProgress > 0) {
73+ return linearAnimation(0, 1, rightFoldingAreaX, flickableWidth - margins - stackWidth, rightEasing.value);
68 readonly property int animatedY: sceneHeight - itemHeight - spreadBottomOffset +
79 readonly property int animatedY: sceneHeight - itemHeight - spreadBottomOffset +
69− (leftFoldingAreaProgress > 0 ?
80+ (limitedLeftProgress > 0 ?
70− linearAnimation(0, 1, yOffset, 0, leftFoldingAreaProgress)
81+ linearAnimation(0, 1, yOffset, 0, leftEasing.value)
71− : rightFoldingAreaProgress > 0 ?
82+ : limitedRightProgress > 0 ?
72− linearAnimation(0, 1, yOffset, 0, rightFoldingAreaProgress)
83+ linearAnimation(0, 1, yOffset, 0, rightEasing.value)
73 : yOffset)
84 : yOffset)
77− property real leftFoldingAreaProgress: (foldingAreaWidth + margins - animatedX) / foldingAreaWidth
78− property real rightFoldingAreaProgress: (animatedX + margins*2 - contentWidth) / foldingAreaWidth
81− // x : foldingAreaWidth = leftEndFoldedAngle: unfoldedAngle
83− readonly property int animatedAngle: leftFoldingAreaProgress > 0 ?
88+ readonly property int animatedAngle: limitedLeftProgress > 0 ?
84− linearAnimation(0, 1, unfoldedAngle, leftEndFoldedAngle, leftFoldingAreaProgress)
89+ linearAnimation(0, 1, unfoldedAngle, leftEndFoldedAngle, leftEasing.value)
85− : rightFoldingAreaProgress > 0 ?
90+ : limitedRightProgress > 0 ?
86− linearAnimation(0, 1, unfoldedAngle, rightEndFoldedAngle, rightFoldingAreaProgress)
91+ linearAnimation(0, 1, unfoldedAngle, rightEndFoldedAngle, rightEasing.value)
87 : unfoldedAngle
92 : unfoldedAngle
90− readonly property real scale: (leftFoldingAreaProgress > 0 ?
95+ readonly property real scale: (limitedLeftProgress > 0 ?
91− linearAnimation(0, 1, spreadHeight * (1 - stackScale), spreadHeight, leftFoldingAreaProgress)
96+ linearAnimation(0, 1, spreadHeight * (1 - stackScale), spreadHeight, leftEasing.value)
92− : rightFoldingAreaProgress > 0 ?
97+ : limitedRightProgress > 0 ?
93− linearAnimation(0, 1, spreadHeight * (1 - stackScale), spreadHeight, rightFoldingAreaProgress)
98+ linearAnimation(0, 1, spreadHeight * (1 - stackScale), spreadHeight, rightEasing.value)
94 : spreadHeight * (1 - stackScale)
99 : spreadHeight * (1 - stackScale)
95 ) / itemHeight
100 ) / itemHeight
98 readonly property real tileInfoOpacity: leftFoldingAreaProgress > 0 ?
103 readonly property real tileInfoOpacity: leftFoldingAreaProgress > 0 ?
99− linearAnimation(0, 0.5, 1, 0, leftFoldingAreaProgress)
104+ linearAnimation(1, 2, 1, 0, leftFoldingAreaProgress)
100 : rightFoldingAreaProgress > 0 ?
105 : rightFoldingAreaProgress > 0 ?
101− linearAnimation(0 ,0.5, 1, 0, rightFoldingAreaProgress)
106+ linearAnimation(1 ,2, 1, 0, rightFoldingAreaProgress)
104 // Helpers
110 // Helpers
105 function linearAnimation(startProgress, endProgress, startValue, endValue, progress) {
111 function linearAnimation(startProgress, endProgress, startValue, endValue, progress) {
106 // progress : progressDiff = value : valueDiff => value = progress * valueDiff / progressDiff
112 // progress : progressDiff = value : valueDiff => value = progress * valueDiff / progressDiff
@@ -108,25 +114,14 @@ Item {
110 EasingCurve {
116 EasingCurve {
111− id: transitionCurve
117+ id: leftEasing
112− type: EasingCurve.InOutSine
114− readonly property real normalizedEndProgress: endProgress - startProgress
115− readonly property real normalizedProgress: (root.adjustedProgress - root.startProgress) / normalizedEndProgress
116− progress: normalizedProgress
121 type: EasingCurve.OutSine
118 type: EasingCurve.OutSine
122− // total : 1 = index : p
119+ progress: limitedLeftProgress / 2 // OutSine starts with twice the speed. slow it down.
123− progress: 1.0 * index / root.totalItems
126 EasingCurve {
122 EasingCurve {
127− id: endLayout
123+ id: rightEasing
128 type: EasingCurve.OutSine
124 type: EasingCurve.OutSine
129− // total : 1 = index : p
125+ progress: limitedRightProgress / 2 // OutSine starts with twice the speed. slow it down.
130− progress: 1 - (1.0 * index / root.totalItems)