Fade in alt-tab popup, adjust timings

The design calls for item to not appear abruptly, but not too slow
either - 100ms seems to be a good sweet spot for elements which are
supposed to appear "instantly".
Add a fade effect to the alt-tab popup and set the timings for other
fade effects to 100ms.

https://bugzilla.gnome.org/show_bug.cgi?id=621247
This commit is contained in:
Florian Müllner 2010-06-10 17:22:23 +02:00
parent eafd3848a9
commit 6e09cc5fc8
4 changed files with 24 additions and 6 deletions

View File

@ -15,12 +15,13 @@ const Tweener = imports.ui.tweener;
const POPUP_APPICON_SIZE = 96; const POPUP_APPICON_SIZE = 96;
const POPUP_SCROLL_TIME = 0.10; // seconds const POPUP_SCROLL_TIME = 0.10; // seconds
const POPUP_FADE_TIME = 0.1; // seconds
const DISABLE_HOVER_TIMEOUT = 500; // milliseconds const DISABLE_HOVER_TIMEOUT = 500; // milliseconds
const THUMBNAIL_DEFAULT_SIZE = 256; const THUMBNAIL_DEFAULT_SIZE = 256;
const THUMBNAIL_POPUP_TIME = 500; // milliseconds const THUMBNAIL_POPUP_TIME = 500; // milliseconds
const THUMBNAIL_FADE_TIME = 0.2; // seconds const THUMBNAIL_FADE_TIME = 0.1; // seconds
const iconSizes = [96, 64, 48, 32, 22]; const iconSizes = [96, 64, 48, 32, 22];
@ -180,6 +181,14 @@ AltTabPopup.prototype = {
return false; return false;
} }
this.actor.opacity = 0;
this.actor.show();
Tweener.addTween(this.actor,
{ opacity: 255,
time: POPUP_FADE_TIME,
transition: 'easeOutQuad'
});
return true; return true;
}, },
@ -352,7 +361,15 @@ AltTabPopup.prototype = {
}, },
destroy : function() { destroy : function() {
this.actor.destroy(); Tweener.addTween(this.actor,
{ opacity: 0,
time: POPUP_FADE_TIME,
transition: 'easeOutQuad',
onComplete: Lang.bind(this,
function() {
this.actor.destroy();
})
});
}, },
_onDestroy : function() { _onDestroy : function() {

View File

@ -21,7 +21,7 @@ const MAX_FILE_DELETED_BEFORE_INVALID = 10;
const HISTORY_KEY = 'run_dialog/history'; const HISTORY_KEY = 'run_dialog/history';
const HISTORY_LIMIT = 512; const HISTORY_LIMIT = 512;
const DIALOG_FADE_TIME = 0.2; const DIALOG_FADE_TIME = 0.1;
function CommandCompleter() { function CommandCompleter() {
this._init(); this._init();

View File

@ -28,7 +28,8 @@ FRAME_COLOR.from_pixel(0xffffffff);
const SCROLL_SCALE_AMOUNT = 100 / 5; const SCROLL_SCALE_AMOUNT = 100 / 5;
const LIGHTBOX_FADE_TIME = 0.2; const LIGHTBOX_FADE_TIME = 0.1;
const CLOSE_BUTTON_FADE_TIME = 0.1;
const DRAGGING_WINDOW_OPACITY = 100; const DRAGGING_WINDOW_OPACITY = 100;
@ -441,7 +442,7 @@ WindowOverlay.prototype = {
this._parentActor.raise_top(); this._parentActor.raise_top();
Tweener.addTween(this.title, Tweener.addTween(this.title,
{ opacity: 255, { opacity: 255,
time: Overview.ANIMATION_TIME, time: CLOSE_BUTTON_FADE_TIME,
transition: 'easeOutQuad' }); transition: 'easeOutQuad' });
}, },

View File

@ -9,7 +9,7 @@ const Main = imports.ui.main;
const Tweener = imports.ui.tweener; const Tweener = imports.ui.tweener;
const ANIMATION_TIME = 0.075; const ANIMATION_TIME = 0.1;
const DISPLAY_TIMEOUT = 600; const DISPLAY_TIMEOUT = 600;
const LEFT = -1; const LEFT = -1;