on xenial help sign in
tweak launcher folding according to feedback from design:

- increase foldingStartHeight - Introduces a foldingStopHeight. Folding only happens between the foldingStartHeight and the foldingStopHeight. - Only change brightness while folding

commit9e104711cf083f8517046b791b4d0a3ea96565ff authorMichael Zanetti <michael.zanetti@canonical.com> dateWed 21 Aug 2013, 09:33 (13 years ago) parent2563253
2 files changed+39−26
Launcher/FoldingLauncherDelegate.qml+36−25 Launcher/LauncherPanel.qml+3−1
Launcher/FoldingLauncherDelegate.qml+36−25
@@ -24,23 +24,23 @@ LauncherDelegate {
2424 angle: {
2525 // First/last items are special
2626 if (index == 0 || index == priv.listView.count-1) {
27− if (priv.distanceFromEdge < 0) {
27+ if (priv.distanceFromEdge < priv.listView.foldingStopHeight) {
2828 // proportion equation: distanceFromTopEdge : angle = totalUnfoldedHeight/2 : maxAngle
29− return Math.max(-maxAngle, priv.distanceFromEdge * maxAngle / (priv.listView.foldingAreaHeight)) * priv.orientationFlag
29+ return Math.max(-maxAngle, priv.distanceFromEdge * maxAngle / (priv.listView.foldingStartHeight)) * priv.orientationFlag
3030 }
3131 return 0; // Don't fold first/last item as long as inside the view
3232 }
3333
34− // Are we in the already completely outside the flickable? Fold for the last 5 degrees
35− if (priv.distanceFromEdge < 0) {
36− // proportion equation: -distanceFromTopEdge : angle = totalUnfoldedHeight : 5
37− return Math.max(-maxAngle, (priv.distanceFromEdge * 5 / priv.listView.foldingAreaHeight) - (maxAngle-5)) * priv.orientationFlag
34+ // We reached the folded area... fold the last 5 degrees
35+ if (priv.overlapWithFoldedArea > 0) {
36+ // proportion equation: overlap : x = height : 5
37+ return ((maxAngle - 5) + (priv.overlapWithFoldedArea * 5 / priv.foldingAreaHeight)) * -priv.orientationFlag
3838 }
3939
4040 // We are overlapping with the folding area, fold the icon to maxAngle - 5 degrees
4141 if (priv.overlapWithFoldingArea > 0) {
4242 // proportion equation: overlap: totalHeight = angle : (maxAngle - 5)
43− return -priv.overlapWithFoldingArea * (maxAngle -5) / priv.listView.foldingAreaHeight * priv.orientationFlag;
43+ return -priv.overlapWithFoldingArea * (maxAngle -5) / priv.foldingAreaHeight * priv.orientationFlag;
4444 }
4545 return 0;
4646 }
@@ -61,9 +61,9 @@ LauncherDelegate {
6161 return (-priv.distanceFromEdge - (root.height - effectiveHeight)) * priv.orientationFlag;
6262 }
6363
64− // We're touching the edge, move slower than the actual flicking speed.
65− if (priv.distanceFromEdge < 0) {
66− return (Math.abs(priv.distanceFromEdge) * priv.totalEffectiveHeight / priv.totalUnfoldedHeight) * priv.orientationFlag
64+ // We stopped folding, move slower than the actual flicking speed.
65+ if (priv.overlapWithFoldedArea > 0) {
66+ return (priv.overlapWithFoldedArea * priv.totalEffectiveHeight / priv.foldingAreaHeight) * priv.orientationFlag;
6767 }
6868 return 0;
6969 }
@@ -72,22 +72,23 @@ LauncherDelegate {
7272 // First/last items are special
7373 if (index == 0 || index == priv.listView.count-1) {
7474 if (priv.distanceFromEdge < 0) {
75− // Fade from 1 to 0 in the distance of 3 * foldingAreaHeight (which is when the next item reaches the edge)
76− return 1.0 - (-priv.distanceFromEdge / (priv.listView.foldingAreaHeight * 3))
75+ // Fade from 1 to 0 while the in 2*foldingAreaHeight
76+ // proportion equation: 0.5 : x = -2*foldingAreaHeight : distance
77+ return 1 + (priv.distanceFromEdge) / (priv.foldingAreaHeight*2)
7778 }
7879 return 1; // Don't make first/last item transparent as long as inside the view
7980 }
8081
81− // Are we already completely outside the flickable? Fade from 0.75 to 0 in 2 items height
82− if (priv.distanceFromEdge < 0) {
83− // proportion equation: -distanceFromEdge : 1-opacity = totalUnfoldedHeight : 0.75
84− return 0.75 - (-priv.distanceFromEdge * 0.75 / (priv.totalUnfoldedHeight*2))
82+ // Did we stop folding? Fade out to 0 in 2*foldingAreaHeight
83+ if (priv.overlapWithFoldedArea > 0) {
84+ // overlap : foldingAreaHeight = opacity : 0.75
85+ return 0.75 - (priv.overlapWithFoldedArea * 0.75 / (priv.foldingAreaHeight*2));
8586 }
8687
87− // We are overlapping with the folding area, fade out to 0.75
88+ // We are overlapping with the folding area, fade out to 0.75 transparency
8889 if (priv.overlapWithFoldingArea > 0) {
8990 // proportion equation: overlap : totalHeight = 1-opacity : 0.25
90− return 1 - (priv.overlapWithFoldingArea * 0.25 / priv.listView.foldingAreaHeight)
91+ return 1 - (priv.overlapWithFoldingArea * 0.25 / priv.foldingAreaHeight)
9192 }
9293 return 1;
9394 }
@@ -95,19 +96,27 @@ LauncherDelegate {
9596 brightness: {
9697 // First/last items are special
9798 if (index == 0 || index == priv.listView.count-1) {
99+
100+ // Traversed one foldingAreaHeight. Stop at 0.5
101+ if (priv.distanceFromEdge < -priv.foldingAreaHeight) {
102+ return -0.5
103+ }
104+
105+ // We started moving, fade to 0.5
98106 if (priv.distanceFromEdge < 0) {
99− return -(-priv.distanceFromEdge / (priv.listView.foldingAreaHeight * 3))
107+ return -0.5 * (-priv.distanceFromEdge / (priv.foldingAreaHeight))
100108 }
101109 return 0;
102110 }
103− // Are we already completely outside the flickable? Fade from 0.7 to 0 in 2 items height
104− if (priv.distanceFromEdge < 0) {
105− return -0.3 - (-priv.distanceFromEdge * 0.1 / (priv.totalUnfoldedHeight*2))
111+
112+ // We stopped folding? Stop brightness change at 0.5
113+ if (priv.overlapWithFoldedArea > 0) {
114+ return -0.5;
106115 }
107116
108− // We are overlapping with the folding area, fade out to 0.7
117+ // We are overlapping with the folding area, fade out to 0.5
109118 if (priv.overlapWithFoldingArea > 0) {
110− return - (priv.overlapWithFoldingArea * 0.3 / priv.listView.foldingAreaHeight)
119+ return - (priv.overlapWithFoldingArea * 0.5 / priv.listView.foldingStartHeight);
111120 }
112121 return 0;
113122 }
@@ -127,7 +136,9 @@ LauncherDelegate {
127136 property real distanceFromEdge: Math.abs(distanceFromBottomEdge) < Math.abs(distanceFromTopEdge) ? distanceFromBottomEdge : distanceFromTopEdge
128137 property real orientationFlag: Math.abs(distanceFromBottomEdge) < Math.abs(distanceFromTopEdge) ? -1 : 1
129138
130− property real overlapWithFoldingArea: listView.foldingAreaHeight - distanceFromEdge
139+ property real overlapWithFoldingArea: listView.foldingStartHeight - distanceFromEdge
140+ property real overlapWithFoldedArea: listView.foldingStopHeight - distanceFromEdge
141+ property real foldingAreaHeight: listView.foldingStartHeight - listView.foldingStopHeight
131142 }
132143
133144}
Launcher/LauncherPanel.qml+3−1
@@ -113,7 +113,9 @@ Item {
113113 property int extensionSize: itemHeight * 3
114114
115115 // The height of the area where icons start getting folded
116− property int foldingAreaHeight: itemHeight * 0.75
116+ property int foldingStartHeight: units.gu(8.5)
117+ // The height of the area where the items reach the final folding angle
118+ property int foldingStopHeight: units.gu(0.5)
117119 property int itemWidth: width
118120 property int itemHeight: width * 7.5 / 8
119121 property int clickFlickSpeed: units.gu(60)