on xenial help sign in
rework animation once more, fix some bugs
cd57eabMichael Zanetti
qml/Stages/DesktopStage.qml+5−5
@@ -38,7 +38,7 @@ FocusScope {
38 appRepeater.highlightedIndex = 1;
38 appRepeater.highlightedIndex = 1;
39 } else {
39 } else {
40 print("focusing app", appRepeater.highlightedIndex)
40 print("focusing app", appRepeater.highlightedIndex)
41− ApplicationManager.focusApplication(ApplicationManager.get(appRepeater.highlightedIndex).appId)
41+ ApplicationManager.requestFocusApplication(ApplicationManager.get(appRepeater.highlightedIndex).appId)
42 }
42 }
43 }
43 }
44
44
@@ -46,7 +46,7 @@ FocusScope {
46 if (root.altTabPressed) {
46 if (root.altTabPressed) {
47 print("should tab next")
47 print("should tab next")
48 appRepeater.highlightedIndex = (appRepeater.highlightedIndex + 1) % ApplicationManager.count;
48 appRepeater.highlightedIndex = (appRepeater.highlightedIndex + 1) % ApplicationManager.count;
49− var newContentX = spreadFlickable.width / 5 * Math.max(0, Math.min(ApplicationManager.count - 5, appRepeater.highlightedIndex - 3));
49+ var newContentX = ((spreadFlickable.contentWidth) / (ApplicationManager.count + 1)) * Math.max(0, Math.min(ApplicationManager.count - 5, appRepeater.highlightedIndex - 3));
50 if (spreadFlickable.contentX < newContentX || appRepeater.highlightedIndex == 0) {
50 if (spreadFlickable.contentX < newContentX || appRepeater.highlightedIndex == 0) {
51 spreadFlickable.snapTo(newContentX)
51 spreadFlickable.snapTo(newContentX)
52 }
52 }
@@ -58,7 +58,7 @@ FocusScope {
58 if (root.altTabPressed) {
58 if (root.altTabPressed) {
59 var newIndex = appRepeater.highlightedIndex - 1 >= 0 ? appRepeater.highlightedIndex - 1 : ApplicationManager.count - 1;
59 var newIndex = appRepeater.highlightedIndex - 1 >= 0 ? appRepeater.highlightedIndex - 1 : ApplicationManager.count - 1;
60 appRepeater.highlightedIndex = newIndex;
60 appRepeater.highlightedIndex = newIndex;
61− var newContentX = spreadFlickable.width / 5 * Math.max(0, Math.min(ApplicationManager.count - 5, appRepeater.highlightedIndex - 1));
61+ var newContentX = ((spreadFlickable.contentWidth) / (ApplicationManager.count + 1)) * Math.max(0, Math.min(ApplicationManager.count - 5, appRepeater.highlightedIndex - 1));
62 if (spreadFlickable.contentX > newContentX || newIndex == ApplicationManager.count -1) {
62 if (spreadFlickable.contentX > newContentX || newIndex == ApplicationManager.count -1) {
63 spreadFlickable.snapTo(newContentX)
63 spreadFlickable.snapTo(newContentX)
64 }
64 }
@@ -157,7 +157,7 @@ FocusScope {
157 name: "altTab"; when: root.state == "altTab"
157 name: "altTab"; when: root.state == "altTab"
158 PropertyChanges {
158 PropertyChanges {
159 target: appDelegate
159 target: appDelegate
160− x: spreadMaths.animatedX
160+ x: spreadMaths.newX
161 y: spreadMaths.animatedY
161 y: spreadMaths.animatedY
162 angle: spreadMaths.animatedAngle
162 angle: spreadMaths.animatedAngle
163 itemScale: spreadMaths.scale
163 itemScale: spreadMaths.scale
@@ -218,7 +218,7 @@ FocusScope {
218
218
219 onFocusChanged: {
219 onFocusChanged: {
220 if (focus) {
220 if (focus) {
221− ApplicationManager.requestFocusApplication(model.appId);
221+ ApplicationManager.focusApplication(model.appId);
222 }
222 }
223 }
223 }
224
224
qml/Stages/SpreadMaths.qml+60−65
@@ -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
5
4
6Item {
5Item {
7−
8− Label {
9− anchors {left: parent.left; top: parent.top }
10− text: "prog:" + transitionCurve.progress.toFixed(2)
11− color: leftFoldingAreaProgress > 0 || rightFoldingAreaProgress > 0 ? "red" : "black"
12− }
13−
14 id: root
6 id: root
15 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
7 anchors { left: parent.left; top: parent.top; margins: units.gu(1) }
16
8
@@ -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)
36
29
37
30
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
50−
51
35
52 readonly property int contentWidth: flickableWidth - root.margins * 2
36 readonly property int contentWidth: flickableWidth - root.margins * 2
53
37
54− readonly property int unfoldedDistance: (contentWidth - foldingAreaWidth) / maxVisibleItems
55−
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
59−
60− readonly property real startX: contentWidth - foldingAreaWidth + (startLayout.value * foldingAreaWidth)
61− readonly property real endX: margins + foldingAreaWidth - (endLayout.value * foldingAreaWidth)
62−
63− readonly property int animatedX: transitionCurve.value * (endX - startX) + startX
64−
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
67
40
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)
44+
45+ readonly property int leftFoldingAreaX: margins + foldingAreaWidth
46+ readonly property int rightFoldingAreaX: flickableWidth - foldingAreaWidth - margins
47+
48+ readonly property real leftFoldingAreaProgress: linearAnimation(leftFoldingAreaX, margins, 0, 1, linearX)
49+ readonly property real rightFoldingAreaProgress: linearAnimation(rightFoldingAreaX, flickableWidth - margins, 0, 1, linearX)
50+
51+ readonly property real limitedLeftProgress: Math.min(2, leftFoldingAreaProgress)
52+ readonly property real limitedRightProgress: Math.min(2, rightFoldingAreaProgress)
53+
54+ // Output
55+ readonly property int animatedX: {
56+ if (leftFoldingAreaProgress > 4) {
57+ return margins;
58+ }
59+ if (leftFoldingAreaProgress > 2) {
60+ return linearAnimation(2, 4, margins + stackWidth, margins, leftFoldingAreaProgress)
61+ }
62+ if (leftFoldingAreaProgress > 0) {
63+ return linearAnimation(0, 1, leftFoldingAreaX, margins + stackWidth, leftEasing.value)
64+ }
65+ if (rightFoldingAreaProgress > 4) {
66+ return flickableWidth - margins
67+ }
68+ if (rightFoldingAreaProgress > 2) {
69+ return linearAnimation(2, 4, flickableWidth - margins - stackWidth, flickableWidth - margins, rightFoldingAreaProgress)
70+ }
71+
72+ if (rightFoldingAreaProgress > 0) {
73+ return linearAnimation(0, 1, rightFoldingAreaX, flickableWidth - margins - stackWidth, rightEasing.value);
74+ }
75+
76+ return linearX;
77+ }
78+
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)
74
85
75
86
76− // faw : 1 = x : p
77− property real leftFoldingAreaProgress: (foldingAreaWidth + margins - animatedX) / foldingAreaWidth
78− property real rightFoldingAreaProgress: (animatedX + margins*2 - contentWidth) / foldingAreaWidth
79−
80
87
81− // x : foldingAreaWidth = leftEndFoldedAngle: unfoldedAngle
82−
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
88
93
89
94
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
96
101
97
102
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)
102 : 1
107 : 1
103
108
109+
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 {
108 }
114 }
109
115
110 EasingCurve {
116 EasingCurve {
111− id: transitionCurve
117+ id: leftEasing
112− type: EasingCurve.InOutSine
113−
114− readonly property real normalizedEndProgress: endProgress - startProgress
115− readonly property real normalizedProgress: (root.adjustedProgress - root.startProgress) / normalizedEndProgress
116− progress: normalizedProgress
117− }
118−
119− EasingCurve {
120− id: startLayout
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
124 }
120 }
125
121
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)
131 }
126 }
132}
127}