This site has been retired. For up to date information, see handbook.gnome.org or gitlab.gnome.org.


[Home] [TitleIndex] [WordIndex

Outline Label

Here's an example of how to create outlined labels in Gtk by inheriting from GtkLabel and overriding its paint method:

//======================================================================
// An example of how to create a Outline label.
//
// Dov Grobgeld <dov.grobgeld@gmail.com>
// Thursday 2009-03-05 20:31 
// This example is in the public domain.
//----------------------------------------------------------------------
using GLib;
using Gtk;
using Cairo;

public class OutlineLabel : Gtk.Label {
    public string label { get; construct; }

    construct {
        this.expose_event += this.on_expose;
        this.set_markup("<span font=\"Bold 50\">"+label+"</span>");
    }

    private bool on_expose(OutlineLabel ol,
                           Gdk.Event event)
    {
        var cr = Gdk.cairo_create(this.window);
        var layout = this.get_layout(); 
        var width=-1, height=-1;
        layout.get_size(out width, out height);
        cr.move_to((this.allocation.width-width / Pango.SCALE)/2,0);

        cr.set_source_rgba(1,0,0,1);
        Pango.cairo_show_layout(cr, layout);
        cr.set_source_rgba(0,0,0,1);
        cr.set_line_width(3.0);
        cr.set_line_join(Cairo.LineJoin.ROUND);
        Pango.cairo_layout_path(cr, layout);
        cr.stroke();

        return true;
    }

    public OutlineLabel(string label) {
        this.label = label;
    }
}

public class DrawOutlineLine : Gtk.Window {
    construct {
        this.destroy += Gtk.main_quit;
        this.title = "DrawOutlineLabel";
        var vbox = new Gtk.VBox(false,0);
        this.add(vbox);
        vbox.show();
        var label = new OutlineLabel("Gtk\nOutline\nLabel");
        label.set_justify(Gtk.Justification.CENTER);
        vbox.pack_start(label, true, true, 0);
        label.show();
        var button = new Button.with_label("Quit");
        button.clicked += btn => {
            Gtk.main_quit();
        };
        button.show();
        vbox.pack_start(button, false, false, 0);
    }
}

int main(string[] args) {
    Gtk.init(ref args);

    var app = new DrawOutlineLine();
    app.show();

    Gtk.main();
    return 0;
}

Result

outline-label-screenshot.png


2024-10-23 10:59