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

js: Use implicit animations for animatable properties

Browse Source 
We now have everything in place to replace Tweener for all animatable
properties with implicit animations, which has the following benefits:

 - they run entirely in C, while Tweener requires context switches
   to JS each frame

 - they are more reliable, as Tweener only detects when an animation
   is overwritten with another Tween, while Clutter considers any
   property change

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/22
This commit is contained in:
Florian Müllner
2018-07-20 21:46:19 +02:00
parent 007b6ca2e8
commit 0846238f69
38 changed files with 1004 additions and 998 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
js/ui/popupMenu.js
View File

@ -10,7 +10,6 @@ const BoxPointer = imports.ui.boxpointer;
const GrabHelper = imports.ui.grabHelper;
const Main = imports.ui.main;
const Params = imports.misc.params;
const Tweener = imports.ui.tweener;
var Ornament = {
NONE: 0,
@ -1013,16 +1012,17 @@ var PopupSubMenu = class extends PopupMenuBase {
if (animate) {
let [, naturalHeight] = this.actor.get_preferred_height(-1);
this.actor.height = 0;
Tweener.addTween(this.actor,
{ height: naturalHeight,
time: 0.25,
onComplete: () => {
this.actor.set_height(-1);
}
});
Tweener.addTween(this._arrow,
{ rotation_angle_z: targetAngle,
time: 0.25 });
this.actor.ease({
height: naturalHeight,
duration: 250,
mode: Clutter.AnimationMode.EASE_OUT_EXPO,
onComplete: () => this.actor.set_height(-1)
});
this._arrow.ease({
rotation_angle_z: targetAngle,
duration: 250,
mode: Clutter.AnimationMode.EASE_OUT_EXPO
});
} else {
this._arrow.rotation_angle_z = targetAngle;
}
@ -1042,17 +1042,20 @@ var PopupSubMenu = class extends PopupMenuBase {
animate = false;
if (animate) {
Tweener.addTween(this.actor,
{ height: 0,
time: 0.25,
onComplete: () => {
this.actor.hide();
this.actor.set_height(-1);
},
});
Tweener.addTween(this._arrow,
{ rotation_angle_z: 0,
time: 0.25 });
this.actor.ease({
height: 0,
duration: 250,
mode: Clutter.AnimationMode.EASE_OUT_EXPO,
onComplete: () => {
this.actor.hide();
this.actor.set_height(-1);
}
});
this._arrow.ease({
rotation_angle_z: 0,
duration: 250,
mode: Clutter.AnimationMode.EASE_OUT_EXPO
});
} else {
this._arrow.rotation_angle_z = 0;
this.actor.hide();