[gnome-shell] workspaceThumbnails: Expand workspaces before scale-in animation
- From: Marge Bot <marge-bot src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell] workspaceThumbnails: Expand workspaces before scale-in animation
- Date: Fri, 29 Jan 2021 20:45:08 +0000 (UTC)
commit b84eb2437d47db4a24ff415bebef2623c407dbf0
Author: Florian Müllner <fmuellner gnome org>
Date: Fri Jan 29 16:25:28 2021 +0100
workspaceThumbnails: Expand workspaces before scale-in animation
When the original animation was implemented, workspaces would only
ever be added at the end. We therefore got away with not having a
separate EXPANDING stage corresponding to the existing COLLAPSING
one when animating out.
Since support for creating in-between workspaces via DND was added,
this is no longer the case. And now that the thumbnails are centered,
the jump is quite noticeable.
Address this by adding new transitional states, so that we can
expand new thumbnails before scaling them in.
Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1609>
js/ui/workspaceThumbnail.js | 38 ++++++++++++++++++++++++++++----------
1 file changed, 28 insertions(+), 10 deletions(-)
---
diff --git a/js/ui/workspaceThumbnail.js b/js/ui/workspaceThumbnail.js
index 4c6909245f..73f25593bd 100644
--- a/js/ui/workspaceThumbnail.js
+++ b/js/ui/workspaceThumbnail.js
@@ -230,13 +230,15 @@ var WindowClone = GObject.registerClass({
var ThumbnailState = {
NEW: 0,
- ANIMATING_IN: 1,
- NORMAL: 2,
- REMOVING: 3,
- ANIMATING_OUT: 4,
- ANIMATED_OUT: 5,
- COLLAPSING: 6,
- DESTROYED: 7,
+ EXPANDING: 1,
+ EXPANDED: 2,
+ ANIMATING_IN: 3,
+ NORMAL: 4,
+ REMOVING: 5,
+ ANIMATING_OUT: 6,
+ ANIMATED_OUT: 7,
+ COLLAPSING: 8,
+ DESTROYED: 9,
};
/**
@@ -928,6 +930,7 @@ var ThumbnailsBox = GObject.registerClass({
let thumbnail = this._thumbnails[newWorkspaceIndex];
this._setThumbnailState(thumbnail, ThumbnailState.NEW);
thumbnail.slide_position = 1;
+ thumbnail.collapse_fraction = 1;
this._queueUpdateStates();
@@ -1034,6 +1037,7 @@ var ThumbnailsBox = GObject.registerClass({
// not the initial fill, and not splicing via DND
thumbnail.state = ThumbnailState.NEW;
thumbnail.slide_position = 1; // start slid out
+ thumbnail.collapse_fraction = 1; // start fully collapsed
this._haveNewThumbnails = true;
} else {
thumbnail.state = ThumbnailState.NORMAL;
@@ -1129,7 +1133,8 @@ var ThumbnailsBox = GObject.registerClass({
if (this._stateCounts[ThumbnailState.ANIMATING_OUT] > 0)
return;
- // Once that's complete, we can start scaling to the new size and collapse any removed thumbnails
+ // Once that's complete, we can start scaling to the new size,
+ // collapse any removed thumbnails and expand added ones
this._iterateStateThumbnails(ThumbnailState.ANIMATED_OUT, thumbnail => {
this._setThumbnailState(thumbnail, ThumbnailState.COLLAPSING);
thumbnail.ease_property('collapse-fraction', 1, {
@@ -1148,6 +1153,17 @@ var ThumbnailsBox = GObject.registerClass({
});
});
+ this._iterateStateThumbnails(ThumbnailState.NEW, thumbnail => {
+ this._setThumbnailState(thumbnail, ThumbnailState.EXPANDING);
+ thumbnail.ease_property('collapse-fraction', 0, {
+ duration: SLIDE_ANIMATION_TIME,
+ mode: Clutter.AnimationMode.EASE_OUT_QUAD,
+ onComplete: () => {
+ this._setThumbnailState(thumbnail, ThumbnailState.EXPANDED);
+ },
+ });
+ });
+
if (this._pendingScaleUpdate) {
this.ease_property('scale', this._targetScale, {
mode: Clutter.AnimationMode.EASE_OUT_QUAD,
@@ -1158,11 +1174,13 @@ var ThumbnailsBox = GObject.registerClass({
}
// Wait until that's done
- if (this._scale != this._targetScale || this._stateCounts[ThumbnailState.COLLAPSING] > 0)
+ if (this._scale !== this._targetScale ||
+ this._stateCounts[ThumbnailState.COLLAPSING] > 0 ||
+ this._stateCounts[ThumbnailState.EXPANDING] > 0)
return;
// And then slide in any new thumbnails
- this._iterateStateThumbnails(ThumbnailState.NEW, thumbnail => {
+ this._iterateStateThumbnails(ThumbnailState.EXPANDED, thumbnail => {
this._setThumbnailState(thumbnail, ThumbnailState.ANIMATING_IN);
thumbnail.ease_property('slide-position', 0, {
duration: SLIDE_ANIMATION_TIME,
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]