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

Redo AppWell glow to be based on a based on a .png instead of cairo

Browse Source 
Instead of drawing an ellipse, use a hand-drawn .png file which
looks a bit less regular and blends better.
This commit is contained in:
Colin Walters
2009-09-03 10:45:01 -04:00
parent 11872cfb79
commit 52abf266c0
4 changed files with 58 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
js/ui/appIcon.js
View File

@ -2,6 +2,7 @@
const Big = imports.gi.Big;
const Clutter = imports.gi.Clutter;
const GLib = imports.gi.GLib;
const Pango = imports.gi.Pango;
const Shell = imports.gi.Shell;
const Lang = imports.lang;
@ -11,7 +12,8 @@ const Main = imports.ui.main;
const GLOW_COLOR = new Clutter.Color();
GLOW_COLOR.from_pixel(0x4f6ba4ff);
const GLOW_PADDING = 5;
const GLOW_PADDING_HORIZONTAL = 3;
const GLOW_PADDING_VERTICAL = 3;
const APP_ICON_SIZE = 48;
@ -41,8 +43,10 @@ AppIcon.prototype = {
this._windows = Shell.AppMonitor.get_default().get_windows_for_app(appInfo.get_id());
let nameBox = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL,
x_align: Big.BoxAlignment.CENTER });
let nameBox = new Shell.GenericContainer();
nameBox.connect('get-preferred-width', Lang.bind(this, this._nameBoxGetPreferredWidth));
nameBox.connect('get-preferred-height', Lang.bind(this, this._nameBoxGetPreferredHeight));
nameBox.connect('allocate', Lang.bind(this, this._nameBoxAllocate));
this._nameBox = nameBox;
this._name = new Clutter.Text({ color: GenericDisplay.ITEM_DISPLAY_NAME_COLOR,
@ -50,34 +54,58 @@ AppIcon.prototype = {
line_alignment: Pango.Alignment.CENTER,
ellipsize: Pango.EllipsizeMode.END,
text: appInfo.get_name() });
nameBox.append(this._name, Big.BoxPackFlags.NONE);
if (this._windows.length > 0) {
let glow = new Shell.DrawingArea({});
glow.connect('redraw', Lang.bind(this, function (e, tex) {
Shell.draw_app_highlight(tex,
this._windows.length,
GLOW_COLOR.red / 255,
GLOW_COLOR.green / 255,
GLOW_COLOR.blue / 255,
GLOW_COLOR.alpha / 255);
}));
this._name.connect('notify::allocation', Lang.bind(this, function () {
let x = this._name.x;
let y = this._name.y;
let width = this._name.width;
let height = this._name.height;
// If we're smaller than the allocated box width, pad out the glow a bit
// to make it more visible
if ((width + GLOW_PADDING * 2) < this._nameBox.width) {
width += GLOW_PADDING * 2;
x -= GLOW_PADDING;
}
glow.set_size(width, height);
glow.set_position(x, y);
}));
nameBox.add_actor(glow);
glow.lower(this._name);
nameBox.add_actor(this._name);
this._glowBox = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL });
let glowPath = GLib.filename_to_uri(Shell.Global.get().imagedir + 'app-well-glow.png', '');
for (let i = 0; i < this._windows.length && i < 3; i++) {
let glow = Shell.TextureCache.get_default().load_uri_sync(Shell.TextureCachePolicy.FOREVER,
glowPath, -1, -1);
glow.keep_aspect_ratio = false;
this._glowBox.append(glow, Big.BoxPackFlags.EXPAND);
}
this._nameBox.add_actor(this._glowBox);
this._glowBox.lower(this._name);
this.actor.append(nameBox, Big.BoxPackFlags.NONE);
},
_nameBoxGetPreferredWidth: function (nameBox, forHeight, alloc) {
let [min, natural] = this._name.get_preferred_width(forHeight);
alloc.min_size = min + GLOW_PADDING_HORIZONTAL * 2;
alloc.natural_size = natural + GLOW_PADDING_HORIZONTAL * 2;
},
_nameBoxGetPreferredHeight: function (nameBox, forWidth, alloc) {
let [min, natural] = this._name.get_preferred_height(forWidth);
alloc.min_size = min + GLOW_PADDING_VERTICAL * 2;
alloc.natural_size = natural + GLOW_PADDING_VERTICAL * 2;
},
_nameBoxAllocate: function (nameBox, box, flags) {
let childBox = new Clutter.ActorBox();
let [minWidth, naturalWidth] = this._name.get_preferred_width(-1);
let [minHeight, naturalHeight] = this._name.get_preferred_height(-1);
let availWidth = box.x2 - box.x1;
let availHeight = box.y2 - box.y1;
let targetWidth = availWidth;
let xPadding = 0;
if (naturalWidth < availWidth) {
xPadding = (availWidth - naturalWidth) / 2;
}
childBox.x1 = Math.floor(xPadding);
childBox.x2 = availWidth;
childBox.y1 = GLOW_PADDING_VERTICAL;
childBox.y2 = availHeight - GLOW_PADDING_VERTICAL;
this._name.allocate(childBox, flags);
// Now the glow
if (this._glowBox != null) {
let glowPaddingHoriz = Math.max(0, xPadding - GLOW_PADDING_HORIZONTAL);
childBox.x1 = Math.floor(glowPaddingHoriz);
childBox.x2 = availWidth - glowPaddingHoriz;
childBox.y1 = 0;
childBox.y2 = availHeight;
this._glowBox.allocate(childBox, flags);
}
}
};