popupMenu: Use a unicode character for the ornament
This makes it easy to replace the dot with another label in the future. Change the allocation logic, as text layout is more complicated than simple icon logic. https://bugzilla.gnome.org/show_bug.cgi?id=698427
This commit is contained in:
parent
4a2f54f6ff
commit
a123ec94ef
@ -125,6 +125,10 @@ StScrollBar StButton#vhandle:active {
|
|||||||
|
|
||||||
/* PopupMenu */
|
/* PopupMenu */
|
||||||
|
|
||||||
|
.popup-menu-ornament {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
.popup-menu-boxpointer,
|
.popup-menu-boxpointer,
|
||||||
.candidate-popup-boxpointer {
|
.candidate-popup-boxpointer {
|
||||||
-arrow-border-radius: 8px;
|
-arrow-border-radius: 8px;
|
||||||
|
@ -59,7 +59,8 @@ const PopupBaseMenuItem = new Lang.Class({
|
|||||||
|
|
||||||
this._children = [];
|
this._children = [];
|
||||||
this._ornament = Ornament.NONE;
|
this._ornament = Ornament.NONE;
|
||||||
this._dot = null;
|
this._ornamentLabel = new St.Label({ style_class: 'popup-menu-ornament' });
|
||||||
|
this.actor.add_actor(this._ornamentLabel);
|
||||||
this._columnWidths = null;
|
this._columnWidths = null;
|
||||||
this._spacing = 0;
|
this._spacing = 0;
|
||||||
this.active = false;
|
this.active = false;
|
||||||
@ -189,32 +190,14 @@ const PopupBaseMenuItem = new Lang.Class({
|
|||||||
this._ornament = ornament;
|
this._ornament = ornament;
|
||||||
|
|
||||||
if (ornament == Ornament.DOT) {
|
if (ornament == Ornament.DOT) {
|
||||||
this._dot = new St.DrawingArea({ style_class: 'popup-menu-item-dot' });
|
this._ornamentLabel.text = '\u2022';
|
||||||
this._dot.connect('repaint', Lang.bind(this, this._onRepaintDot));
|
this.actor.add_accessible_state(Atk.StateType.CHECKED);
|
||||||
this.actor.add_actor(this._dot);
|
|
||||||
this.actor.add_accessible_state (Atk.StateType.CHECKED);
|
|
||||||
} else if (ornament == Ornament.NONE) {
|
} else if (ornament == Ornament.NONE) {
|
||||||
this._dot.destroy();
|
this._ornamentLabel.text = '';
|
||||||
this._dot = null;
|
this.actor.remove_accessible_state(Atk.StateType.CHECKED);
|
||||||
this.actor.remove_accessible_state (Atk.StateType.CHECKED);
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
_onRepaintDot: function(area) {
|
|
||||||
let cr = area.get_context();
|
|
||||||
let [width, height] = area.get_surface_size();
|
|
||||||
let color = area.get_theme_node().get_foreground_color();
|
|
||||||
|
|
||||||
cr.setSourceRGBA (
|
|
||||||
color.red / 255,
|
|
||||||
color.green / 255,
|
|
||||||
color.blue / 255,
|
|
||||||
color.alpha / 255);
|
|
||||||
cr.arc(width / 2, height / 2, width / 3, 0, 2 * Math.PI);
|
|
||||||
cr.fill();
|
|
||||||
cr.$dispose();
|
|
||||||
},
|
|
||||||
|
|
||||||
// This returns column widths in logical order (i.e. from the dot
|
// This returns column widths in logical order (i.e. from the dot
|
||||||
// to the image), not in visual order (left to right)
|
// to the image), not in visual order (left to right)
|
||||||
getColumnWidths: function() {
|
getColumnWidths: function() {
|
||||||
@ -285,26 +268,25 @@ const PopupBaseMenuItem = new Lang.Class({
|
|||||||
let height = box.y2 - box.y1;
|
let height = box.y2 - box.y1;
|
||||||
let direction = this.actor.get_text_direction();
|
let direction = this.actor.get_text_direction();
|
||||||
|
|
||||||
if (this._dot) {
|
// The ornament is placed outside box
|
||||||
// The dot is placed outside box
|
|
||||||
// one quarter of padding from the border of the container
|
// one quarter of padding from the border of the container
|
||||||
// (so 3/4 from the inner border)
|
// (so 3/4 from the inner border)
|
||||||
// (padding is box.x1)
|
// (padding is box.x1)
|
||||||
let dotBox = new Clutter.ActorBox();
|
let ornamentBox = new Clutter.ActorBox();
|
||||||
let dotWidth = Math.round(box.x1 / 2);
|
let ornamentWidth = box.x1;
|
||||||
|
|
||||||
if (direction == Clutter.TextDirection.LTR) {
|
ornamentBox.x1 = 0;
|
||||||
dotBox.x1 = Math.round(box.x1 / 4);
|
ornamentBox.x2 = ornamentWidth;
|
||||||
dotBox.x2 = dotBox.x1 + dotWidth;
|
ornamentBox.y1 = box.y1;
|
||||||
} else {
|
ornamentBox.y2 = box.y2;
|
||||||
dotBox.x2 = box.x2 + 3 * Math.round(box.x1 / 4);
|
|
||||||
dotBox.x1 = dotBox.x2 - dotWidth;
|
if (direction == Clutter.TextDirection.RTL) {
|
||||||
}
|
ornamentBox.x1 += box.x2;
|
||||||
dotBox.y1 = Math.round(box.y1 + (height - dotWidth) / 2);
|
ornamentBox.x2 += box.x2;
|
||||||
dotBox.y2 = dotBox.y1 + dotWidth;
|
|
||||||
this._dot.allocate(dotBox, flags);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this._ornamentLabel.allocate(ornamentBox, flags);
|
||||||
|
|
||||||
let x;
|
let x;
|
||||||
if (direction == Clutter.TextDirection.LTR)
|
if (direction == Clutter.TextDirection.LTR)
|
||||||
x = box.x1;
|
x = box.x1;
|
||||||
|
Loading…
Reference in New Issue
Block a user