调整文本框小部件的大小以适合内容

Question

我正在创建一个小部件来指示cpu使用百分比。小部件是一个图形，顶部绘有文本框。由于文本与图形颜色相同，我想给文本一个背景。所以我试过这样的事情：

cpu_graph = wibox.widget {
    widget = wibox.widget.graph,
    width = 40,
}
vicious.cache(vicious.widgets.cpu)
vicious.register(cpu_graph, vicious.widgets.cpu, "$1", 2)
cpu_text = wibox.widget {
    align = 'center',
    widget = wibox.widget.textbox
}
vicious.register(cpu_text, vicious.widgets.cpu, "$1%", 2)
cpu_txt_bg = wibox.container.background(
    cpu_text,
    '#ff0000',
    gears.shape.rectangle
)
cpu_graph_s = wibox.widget {
    wibox.container.mirror(cpu_graph, { horizontal = true }),
    cpu_txt_bg,
    layout = wibox.layout.stack
}

不幸的是，背景似乎覆盖了整个图形：

我认为这是因为文本框与图表的大小相同，所以我认为文本框应该调整大小以适应它的内容。

使用保证金容器我得到了我想要的东西：

cpu_graph_s = wibox.widget {
    wibox.container.mirror(cpu_graph, { horizontal = true }),
    wibox.container.margin(cpu_txt_bg, 12, 12, 5, 5)
    layout = wibox.layout.stack
}

结果更好：

可悲的是，当文本大小发生变化时，这似乎会调整整个图表的大小：

有没有更好的解决方案来调整文本框的大小而不改变整个图形的大小？

Answer 1

而不是"$1%"，请尝试'<span bgcolor="#ff0000">$1%</span>'。请参阅https://developer.gnome.org/pango/stable/PangoMarkupFormat.html。