Seitenleiste

Dies ist eine alte Version des Dokuments!


Anordnung von GUI-Elementen

Bis jetzt haben wir nur ein leeres Fenster. Nun wollen wir dieses mit Inhalt füllen, doch wie machen wir das mit GTK?

Das Prinzip der Boxen

Bei vielen GUI-Toolkits wird die Position eines Elementes mit Koordinaten angegeben, zum Beispiel (10|50). In GTK allerdings benutzt man dafür in der Regel Boxen, doch was steht hinter diesem Namen?

In GTK unterscheidet man zwei Arten von Boxen, die horizontalen und die vertikalen. In einer horizontalen Box werden die Elemente horizontal angeordnet, beginnend auf der linken Seite.
Horizontale GTK-Box

In einer vertikalen Box ist dies anders, dort werden die Elemente vertikal, von oben nach unten, angeordnet.
Vertikale GTK-Box

Nun gibt es zwei Möglichkeiten, ein Element in solch eine Box zu „packen“. Es besteht einmal die Möglichkeit, das Element an den Anfang zu setzen und die Möglichkeit, es an das Ende zu setzen. Das soll nun aber nicht heißen, dass man nur zwei Elemente in eine Box setzen kann. Möchte man ein drittes oder viertes Element in eine Box setzen, so benutzt man einfach eine Packmethode noch einmal. So lassen sich in eine Box beliebig viele Elemente unterbringen.

Einsatz von GTK Boxen

Dieses Prinzip mag am Anfang sehr kompliziert sein, doch je mehr man sich mit der Materie beschäftigt, desto besser wird man es verstehen. Folgender Code zeigt den Einsatz einer vertikalen Box:

#include <gtk/gtk.h>
 
int main(int argc, char** argv)
{
    GtkWidget *window;
    GtkWidget *vbox;
 
    gtk_init(&argc, &argv);
 
    window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
 
    vbox = gtk_vbox_new(FALSE, 0);
    gtk_container_add(GTK_CONTAINER(window), vbox);
 
    gtk_box_pack_start(GTK_BOX(vbox), gtk_label_new("Element 1"), FALSE, FALSE, 0);
    gtk_box_pack_end(GTK_BOX(vbox), gtk_label_new("Element 2"), FALSE, FALSE, 0);
    gtk_box_pack_start(GTK_BOX(vbox), gtk_label_new("Element 3"), FALSE, FALSE, 0);
 
    g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
 
    gtk_widget_show_all(window);
 
    gtk_main();
    return 0;
}

Besprechen wir nun wieder jede neue Funktion.

vbox = gtk_vbox_new(FALSE, 0);

Mit dieser Funktion erstellen wir eine neue vertikale Box (vbox). Diese Funktion hat zwei Argumente:

  • einen gboolean, der angibt, ob jedes Element gleich viel Platz bekommt (TRUE/FALSE).
  • einen Integer-Wert, der den Abstand der zwischen den einzelnen Elemente angibt.

Möchte man eine horizontale Box erstellen, so heißt die Funktion:

gtk_hbox_new(gboolean homogeneous, gint spacing);

Die Verwendung ist die selbe.

gtk_box_pack_start(GTK_BOX(vbox), gtk_label_new("Element 1"), FALSE, FALSE, 0);

Mit gtk_box_pack_start setzen wir ein Element an den Anfang einer Box. Dabei geben wir zuerst an, in welche Box gepackt werden soll. Danach geben wir das Widget an, welches gepackt werden soll. Dafür erstellen wir hier ein Label, dies ist ein ganz einfaches Text-Widget, welches wir im nächsten Kapitel noch genauer besprechen werden. Danach folgen zwei gbooleans. Der erste gibt an, ob das Widget sich vergrößern darf, falls mehr Platz zur Verfügung steht. Der zweite regelt, on sich das Widget dabei im ganzen Raum ausbreiten darf, ob es ihn füllen darf. Der letzte Integer-Wert legt fest, wie viel Platz um das Widget herum gelassen wird.

gtk_box_pack_end(GTK_BOX(vbox), gtk_label_new("Element 2"), FALSE, FALSE, 0);

Diese Funktion ist ähnelt der oberen, doch setzt sie das Widget nicht an den Anfang, sondern an das Ende der Box. Wird diese Funktion später mit einem anderen Widget in der gleichen Box nach einmal verwendet, so wird das Widget vor das zuletzt ans Ende gesetzte Widget platziert.

Doch haben wir nicht jetzt eine Zeile vergessen?

gtk_container_add(GTK_CONTAINER(window), vbox);

Mit dieser Funktion setzen wir die vertikale Box auf das Fenster. Ein Fenster hat bloß einen Container, in den ein Widget gepackt werden kann. Gerade aus diesem Grund sind Boxen in GTK sehr wichtig.

Ende dieses Artikels

Der Einsatz von Boxen gehört zu wichtigsten Teilen der GUI-Entwicklung mit GTK+. Deshalb: Verändert den oben gezeigten Quelltext, um die Funktion der einzelnen neues Ausdrücken zu begreifen. In der nächsten Lektion werden wir uns dann mit einfachen GTK-Widgets beschäftigen, um endlich etwas mehr zu sehen als nur ein kleines Fenster…

zurück || hoch zur Startseite || weiter


Autorendiskussion