如何在 Gnome-Shell-Extension 中将文本打印到绘图区

Question

我正在做我的第一个 gnome-shell 扩展（gnome shell 41.3），我似乎遇到了最常见的问题，找到了正确的手册...

我努力实现的是...

桌面上显示的小部件（高于一切）...
在小部件中绘制一些东西...
向小部件写入一些文本...

我已经完成的是...

使用 DrawingArea 和 Cairo（我假设）我可以使用 .moveTo ()、.lineTo () 等...、.stroke() 将某些内容绘制到我的小部件中...
当小部件显示在所有其他内容之上...
我的扩展有一个设置小部件来配置...

我缺少的是...

关于如何将除绘图内容之外的文本放入绘图区域的任何线索...

我用了 1.5 天的 duckduckgoing 来研究它，但是，我又一次运行在圈子里，没有一个关于如何继续的想法...

谁能指出我正确的方向，请...???

伪代码是这样的

const {St, GLib} = imports.gi;

var area = new St.DrawingArea({
        style_class : 'bg-color',
        reactive : true,
        can_focus : true,
        track_hover : true,
        width: myWidth,
        height: myHeight
    });

area.connect('repaint', (area) => drawMyStuff(area));

Main.layoutManager.addChrome(area, {
    affectsInputRegion : false,
    affectsStruts : false,
    trackFullscreen : false,
    });

timeout = GLib.timeout_add(0, 500, () => {
    this.area.queue_repaint();
    return true;
    });

function drawMyStuff(area) {
    let cr = area.get_context();

    cr.translate(area.width / 2, area.height / 2);
    cr.scale(area.width / 2, area.height / 2);

    cr.setSourceRGBA (1, 1, 1, 1);
    cr.arc(0.0, 0.0, 1.0 - 0.05, 0, 2 * Math.PI);
    cr.fill();

    /*
     * Would like to print some text here but obviously I am to stupid to do so...
     * Help me StackExchangeCommunity, you're my only hope...
     *
     * Obviously it is not that easy:
     * cr.setSourceRGBA (1, 0, 0, 1);
     * cr.write(0.0, 0.0, "Not a moon")
     * cr.fill();
     *
     */ 
    
    cr.$dispose();
    return true;
}

Answer 1

很难找到，我没有找到任何相关文档，但是在深入研究 GJS 的 GJS 代码后 (https://gitlab.gnome.org/GNOME/gjs/-/blob/HEAD/modules/cairo-context.cpp) I was able to understand a lot more on how to do cairo stuff like this (https://www.cairographics.org/manual/)...

我的上述问题的解决方案是这样的：

function drawMyStuff(area) {
    let cr = area.get_context();

    cr.translate(area.width / 2, area.height / 2);
    cr.scale(area.width / 2, area.height / 2);

    cr.setSourceRGBA (1, 1, 1, 1);
    cr.arc(0.0, 0.0, 1.0 - 0.05, 0, 2 * Math.PI);
    cr.fill();

    /*
     * Thank me, I'm my only hope...
     *
     * Obviously it is that easy:
     *
     */ 

    cr.moveTo(-0.5,-0.5);
    cr.setSourceRGBA (1, 0, 0, 1);
    cr.setFontSize(0.125);
    cr.showText('No Moon');

    cr.$dispose();
    return true;
}

如何在 Gnome-Shell-Extension 中将文本打印到绘图区

How to Print Text to DrawingArea in Gnome-Shell-Extension

gnome-shell-extensions

gjs

drawingarea