gtk3
Glade mit Builder-API verwenden

[C ++] mit Gtk :: Builder in gtkmm

Überblick

Gtk + unterstützt einen Workflow, bei dem die Aufgabe des Benutzeroberflächenentwurfs und die Aufgabe der Programmierung voneinander getrennt werden. Obwohl die Benutzeroberflächenelemente wie Schaltflächen, Menüs, Layout usw. direkt aus dem Code hinzugefügt werden können, wird der Code nicht nur durcheinander gebracht, sondern auch die Benutzeroberfläche für alle Benutzer außer dem Programmierer zu ändern. Außerdem werden einige Elemente der Benutzeroberfläche nur zur Aufnahme der Layoutstruktur verwendet und müssen nicht an der Logik teilnehmen. Sie müssen nur aus dem Code hinzugefügt werden, um sie länger zu machen. Stattdessen kann Glade verwendet werden, um eine Beschreibung der Benutzeroberfläche zu generieren, da XML und die Gtk + Builder-API zum Laden der Benutzeroberfläche und zum Ausführen derselben verwendet werden können.

Arbeitsablauf

1. Gestalten Sie Benutzeroberflächenelemente in Glade per Drag & Drop. Glade generiert eine XML-Datei, die Beschreibungen der Benutzeroberfläche enthält. Dies kann auch manuell erfolgen, indem Sie die richtige XML-Syntax schreiben und mit der Erweiterung .glade .
2. Laden Sie die Benutzeroberfläche direkt aus der Datei mit

   auto ui = Gtk::Builder::create_from_file("ui.glade");
   

3. Greifen Sie auf einzelne Elemente der Benutzeroberfläche zu

   // when element doesn't need to be added to another UI element
   auto ui_elem = Glib::RefPtr<Gtk::Button>::cast_dynamic(
       ui->get_object("button_UI_id")
   );
   // when element needs to be added to another widget
   Gtk::Button *btn = nullptr;
   ui->get_widget<Gtk::Button>("button_UI_id", btn);
   

Beispiel

einfach.glade

<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated with glade 3.20.0 -->
<interface>
  <requires lib="gtk+" version="3.20"/>
  <object class="GtkBox" id="cont">
    <property name="width_request">200</property>
    <property name="height_request">200</property>
    <property name="visible">True</property>
    <property name="can_focus">False</property>
    <property name="orientation">vertical</property>
    <child>
      <object class="GtkLabel" id="display_label">
        <property name="visible">True</property>
        <property name="can_focus">False</property>
        <property name="wrap">True</property>
        <attributes>
          <attribute name="weight" value="bold"/>
          <attribute name="scale" value="5"/>
          <attribute name="foreground" value="#a4a400000000"/>
        </attributes>
      </object>
      <packing>
        <property name="expand">True</property>
        <property name="fill">True</property>
        <property name="position">0</property>
      </packing>
    </child>
    <child>
      <object class="GtkButton" id="display_button">
        <property name="label" translatable="yes">Display Message</property>
        <property name="visible">True</property>
        <property name="can_focus">True</property>
        <property name="receives_default">True</property>
      </object>
      <packing>
        <property name="expand">False</property>
        <property name="fill">True</property>
        <property name="position">1</property>
      </packing>
    </child>
  </object>
</interface>

einfach.cpp

#include <gtkmm/application.h>
#include <gtkmm/applicationwindow.h>
#include <gtkmm/button.h>
#include <gtkmm/label.h>
#include <gtkmm/box.h>
#include <gtkmm/builder.h>

class HelloWindow : public Gtk::ApplicationWindow {
    Gtk::Box *cont;
    Glib::RefPtr<Gtk::Label> display_label;
    Glib::RefPtr<Gtk::Button> display_btn;
    Glib::RefPtr<Gtk::Builder> ui;
public:
    HelloWindow()
    : ui{Gtk::Builder::create_from_file("simple.glade")} {
        if(ui) {
            ui->get_widget<Gtk::Box>("cont", cont);
            display_label = Glib::RefPtr<Gtk::Label>::cast_dynamic(
                ui->get_object("display_label")
            );
            display_btn = Glib::RefPtr<Gtk::Button>::cast_dynamic(
                ui->get_object("display_button")
            );
            if(cont && display_label && display_btn) {
                display_btn->signal_clicked().connect(
                [this]() {
                    display_label->set_text("Hello World");
                });
                add(*cont);
            }
        }
        set_title("Simple Gtk::Builder demo");
        set_default_size(400, 400);
        show_all();
    }
};

int main(int argc, char *argv[]) {
    auto app = Gtk::Application::create(
        argc, argv, 
        "org.gtkmm.example.HelloApp"
    );
    HelloWindow hw;
    return app->run(hw);
}

Ausgabe

Verwendung von Gio :: Resource

Das Laden von Benutzeroberflächen direkt aus .glade Dateien ist schnell und einfach. Wenn die Anwendung gepackt ist, können UI-Beschreibungen, Symbole und andere Bilder in Ressourcenpaketen zusammengefasst werden . Zunächst muss eine Ressourcenbeschreibung als XML-Datei erstellt werden.

resources.xml

<gresources>
    <gresource prefix="/unique/prefix/">
        <file>icon.png</file>
        <!-- text files such as XML can be compressed to save memory -->
        <file compressed="true">ui.glade</file>
    </gresource>
</gresources>

Dann erstellen Sie entweder eine separate .gresource Datei oder eine .c Datei mit Ressourcen als String-Daten, die als Teil der Anwendung verknüpft werden sollen.

# generates separate resource file
glib-compile-resources --target=ui.gresource resources.xml
# generates .c file
glib-compile-resources --generate-source resources.xml

Laden Sie dann das Ressourcenpaket aus dem Anwendungscode

// from separate file
auto resource_bundle = Gio::Resource::create_from_file("ui.gresource");
// from stream of bytes in .c file
auto resource_bundle = Glib:wrap(draw_resource_get_resource());
resource_bundle.register_global();

Laden Sie die Benutzeroberflächenelemente aus dem Ressourcenpaket

auto ui = Gtk::Builder::create_from_resource("/unique/prefix/ui.glade");