Search code examples
linuxgtk3vala

How can I change the font size of a Gtk.Label in vala?


I'm a Vala/Gtk newbie and I'm trying to change the font size of a Gtk.Label, but I can't find a good way to do it.

I find out that I can use the markup like this :

    var welcome_message = new Gtk.Label ("<span size='17000'>Hello</span>");
    welcome_message.set_use_markup (true);

But it seems a little hackish. What is the right way to do it ?


Solution

  • Thanks lethalman and nemequ.

    I think it might help someone so here is a little example of how to use css with Vala.

    using Gtk;
    
    public class StyleApp1 : Gtk.Window
    {
        public StyleApp1() 
        {
    
            this.title = "Style app example";
            this.set_border_width (10);
            this.set_position (Gtk.WindowPosition.CENTER);
    
            this.set_default_size (350, 200);
            this.destroy.connect (Gtk.main_quit);
    
            var screen = this.get_screen ();
            var css_provider = new Gtk.CssProvider();
    
            string path = "styleapp1.css";
    
            // test if the css file exist
            if (FileUtils.test (path, FileTest.EXISTS))
            {
                try {
                    css_provider.load_from_path(path);
                    Gtk.StyleContext.add_provider_for_screen(screen, css_provider, Gtk.STYLE_PROVIDER_PRIORITY_USER);
                } catch (Error e) {
                    error ("Cannot load CSS stylesheet: %s", e.message);
                }
            }
    
            var box = new Gtk.Box (Gtk.Orientation.VERTICAL, 10);
            this.add (box);
    
            var label = new Gtk.Label ("Thank you");
            box.add (label);
    
            var label2 = new Gtk.Label ("Stackoverflow");
            label2.get_style_context().add_class("my_class");
            box.add (label2);
        }
    }
        
    static int main(string[] args) {
        Gtk.init(ref args);
        
        StyleApp1 win = new StyleApp1();
        win.show_all();
        
        Gtk.main();
        return 0;
    }
    

    and the styleapp1.css file :

    GtkWindow {
        font-size: 17px;
    }
    
    .my_class {
        color: pink;
    }
    

    NB : if you use add_provider instead of add_provider_for_screen. You have to use add_provider for every widget that you want to customize.