isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

iconGrid: Animate icon positions

Browse Source 
As per design guidance, animate the icons when the grid changes.
Each icon takes 250ms to transition, and starts moving 25ms after
the previous one.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/882
This commit is contained in:
Georges Basile Stavracas Neto 2019-12-04 16:34:34 -03:00 committed by Florian Müllner
parent ef4009f17d
commit 0e3a2654d4
1 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
js/ui/iconGrid.js
View File

@ -28,6 +28,8 @@ var AnimationDirection = {
var APPICON_ANIMATION_OUT_SCALE = 3;
var APPICON_ANIMATION_OUT_TIME = 250;
const ICON_POSITION_DELAY = 25;
var BaseIcon = GObject.registerClass(
class BaseIcon extends St.Bin {
_init(label, params) {
@ -194,6 +196,23 @@ function zoomOutActorAtPos(actor, x, y) {
});
}
function animateIconPosition(icon, box, flags, nChangedIcons) {
if (!icon.has_allocation() || icon.allocation.equal(box)) {
icon.allocate(box, flags);
return false;
}
icon.save_easing_state();
icon.set_easing_mode(Clutter.AnimationMode.EASE_OUT_QUAD);
icon.set_easing_delay(nChangedIcons * ICON_POSITION_DELAY);
icon.allocate(box, flags);
icon.restore_easing_state();
return true;
}
var IconGrid = GObject.registerClass({
Signals: { 'animation-done': {},
'child-focused': { param_types: [Clutter.Actor.$gtype] } },
@ -366,6 +385,7 @@ var IconGrid = GObject.registerClass({
let y = box.y1 + this.topPadding;
let columnIndex = 0;
let rowIndex = 0;
let nChangedIcons = 0;
for (let i = 0; i < children.length; i++) {
let childBox = this._calculateChildBox(children[i], x, y, box);
@ -375,7 +395,9 @@ var IconGrid = GObject.registerClass({
} else {
if (!animating)
children[i].opacity = 255;
children[i].allocate(childBox, flags);
if (animateIconPosition(children[i], childBox, flags, nChangedIcons))
nChangedIcons++;
}
columnIndex++;
@ -875,9 +897,13 @@ var PaginatedIconGrid = GObject.registerClass({
let y = box.y1 + this.topPadding;
let columnIndex = 0;
let nChangedIcons = 0;
for (let i = 0; i < children.length; i++) {
let childBox = this._calculateChildBox(children[i], x, y, box);
children[i].allocate(childBox, flags);
if (animateIconPosition(children[i], childBox, flags, nChangedIcons))
nChangedIcons++;
children[i].show();
columnIndex++;