Buchempfehlung
MySQL kurz & gut
MySQL kurz & gut
Das preiswerte Taschen- buch stellt MySQL-rele- vante Inhalte systematisch und knapp dar, sodass es sich optimal zum Nach- schlagen beim Pro- grammieren eignet. [Mehr Infos...]
FreeBASIC-Chat
Es sind Benutzer im FreeBASIC-Chat online.
(Stand:  )
FreeBASIC bei Twitter
Twitter FreeBASIC-Nachrichten jetzt auch über Twitter erhalten. Follow us!

Tutorial

Gtk - Buttons und Boxen

von MitgliedStueberSeite 1 von 1

Für dieses Tutorial solltest du bereits das Tutorial Gtk - Einführung gelesen haben und die dort genannten Voraussetzungen erfüllen.

Einen einfachen Button

Ein Button, auch als Schaltfläche bekannt, ist allgemein ein rechteckiges Steuerelement, das eine Beschriftung besitzt und bei dem das Anklicken eine Reaktion hervorruft.
Einen neuen Button kannst du am einfachsten mit

gtk_button_new_with_label("Text")

erstellen. Wenn du jetzt das Beispiel aus dem letzten Tutorial nimmst und einfach diese Zeile einfügst, wirst du keinen Unterschied sehen. Woher soll Gtk wissen, wo der Button sein soll? Dafür verwendet Gtk ein Konzept, das "Packing Boxes" heißt.

Packing Boxes

Boxen sind Dinge wie Fenster oder Buttons, nur dass man sie nicht sehen kann. Ihre einzige Aufgabe ist das Anordnen von Steuerelementen. Die einfachste Box ist ein Fenster, die anderen wirst du später kennen lernen. Ein Fenster kann nur ein Steuerelement gleichzeitig beinhalten. Dieses wird automatisch auf die volle Größe des Fensters vergrößert. Einen Button kannst du mit der Funktion Externer Link!gtk_container_add() zu einem Fenster hinzufügen.

Ein Beispiel

Buttons werden über den selben Datentyp wie Fenster angesprochen, also GtkWidget ptr. Einen einfachen Button bekommst du mit diesem Quelltext:

#include once "gtk/gtk.bi"

gtk_init (0, 0)

dim as GtkWidget ptr win = gtk_window_new (GTK_WINDOW_TOPLEVEL)
gtk_window_set_title (GTK_WINDOW (win), "Test")

'Achtung, neue Zeilen
dim as GtkWidget ptr button = gtk_button_new_with_label("Button Text")
gtk_container_add (GTK_CONTAINER (win), button)

gtk_widget_show_all (win)

'Die Hauptschleife, wie schon im ersten Tutorial
gtk_main()

In dem Teil, der neu ist, wird zuerst eine Variable vom Typ GtkWidget ptr mit dem Namen "button" erzeugt und auch gleich initialisiert mit Externer Link!gtk_button_new_with_label().
In der nächsten Zeile wird der Button zum Fenster hinzugefügt. Das Makro GTK_CONTAINER() verhindert nur störende Compiler-Warnungen. um das Fenster anzuzeigen wird jetzt gtk_widget_show_all() verwendet. Diese Funktion tut das selbe wie gtk_widget_show(), zeigt aber auch die beinhalteten Steuerelemente an. Hier könnte man also stattdessen schreiben:

gtk_widget_show(win)
gtk_widget_show(button)

Andere Boxen

Ein Fenster kann als Box nicht sonderlich viel. Man kann nur ein Steuerelement hinein packen das nur auf die volle Größe des Fenster vergrößert wird. Zum Glück gibt es noch ein paar andere Boxen. Die wichtigsten werden mit gtk_hbox_new() und gtk_vbox_new() erzeugt. H steht hierbei für horizontal und v für vertikal. Wenn man jetzt mehr als einen Button benötigt, was dem Normalfall entspricht, werden diese Boxen gebraucht. Solltest du einfach den Code für das Erstellen eines Buttons zweimal benutzen wirst du von Gtk in der Konsole den Hinweis erhalten, dass ein Fenster nur ein Steuerelement beinhalten kann. Die Funktion gtk_hbox_new() bzw. gtk_vbox_new() hat zwei Parameter: der erste ist vom Typ gboolean und ist entweder wahr oder falsch. Er legt fest ob alle Steuerelemente die gleiche Größe haben sollen. Der zweite ist ein Integer und legt den Platz zwischen den Steuerelementen fest.
Wenn du zwei Buttons in ein Fenster packen willst sieht der Quelltext also so aus:

#include once "gtk/gtk.bi"

gtk_init (0, 0)

dim as GtkWidget ptr win = gtk_window_new (GTK_WINDOW_TOPLEVEL)
gtk_window_set_title (GTK_WINDOW (win), "Test")

dim as GtkWidget ptr button = gtk_button_new_with_label("Button 1")

dim as GtkWidget ptr button2 = gtk_button_new_with_label("Button 2")

dim as GtkWidget ptr vbox = gtk_vbox_new(FALSE,0)
gtk_container_add (GTK_CONTAINER(vbox), button)
gtk_container_add (GTK_CONTAINER(vbox), button2)

gtk_container_add (GTK_CONTAINER(win), vbox)
gtk_widget_show_all (win)


gtk_main()

Die Buttons werden zur vbox hinzugefügt und die vbox wird wiederum zum Fenster hinzugefügt. Die vbox hier hat als zweiten Parameter 0 (der Parameter heißt "spacing"). Teste am besten mal ein bisschen was das Ändern des Parameters bewirkt. Die vbox selbst kannst du nicht sehen, sie ist nur dazu da um die anderen Steuerelemente zu platzieren. Wie man sieht kann man Boxen auch in andere Boxen packen.

Container

Ein Container ist wie eine Box, nur etwas allgemeiner. Eine Scrollfläche oder ein Frame sind zum Beispiel Container. Der einzige Container der jetzt für dich interessant ist, ist der "Fixed Container". In einem "Fixed Container" können Koordianten absolut angegeben werden. Das heißt dass du ganz explizit schreiben kannst dass zum Beispiel ein Button an die Koordinate (20|50) gesetzt werden soll. Der Ursprung ist hierbei links oben in der Ecke (also der Punkt (0|0)).
Ein solcher Container wird mit gtk_fixed_new() erzeugt. Anstatt gtk_container_add() wird hier gtk_fixed_put() verwendet. Diese Funktion hat vier Parameter: der erste ist der GtkWidget ptr der von gtk_fixed_new() zurück gegeben wurde. Der zweite ist der GtkWidget ptr des Steuerelements. Die letzten beiden sind die X und Y Koordinaten.
So könnte ein Beispiel aussehen:

#include once "gtk/gtk.bi"

gtk_init (0, 0)

dim as GtkWidget ptr win = gtk_window_new (GTK_WINDOW_TOPLEVEL)
gtk_window_set_title (GTK_WINDOW (win), "Test")

dim as GtkWidget ptr button = gtk_button_new_with_label("Button 1")

dim as GtkWidget ptr button2 = gtk_button_new_with_label("Button 2")

dim as GtkWidget ptr box = gtk_fixed_new()
gtk_fixed_put (box, button,10,10)
gtk_fixed_put (box, button2,50,50)

gtk_container_add (GTK_CONTAINER(win), box)
gtk_widget_show_all (win)


gtk_main()

Die Position kann später noch geändert werden mit gtk_fixed_move(). Die Funktion hat die gleichen Parameter wie gtk_fixed_put(). Durch kombinieren von "Fixed Containern" und Boxen können die meisten Layouts verwirklicht werden.

Hier noch ein weiteres Beispiel

#include  once  "gtk/gtk.bi"

Declare Sub TextToLabel(Text As String)


sub callback_1 Cdecl (ByVal widget as GtkWidget ptr, byval user_data as gpointer)
  TextToLabel("Button_1 geklickt!")
End sub

sub callback_2 Cdecl (byval widget as GtkWidget ptr, byval user_data as gpointer)
  TextToLabel("Button_2 geklickt!")
end sub

sub callback_3 Cdecl (byval widget as GtkWidget ptr, byval user_data as gpointer)
  TextToLabel("Beenden Button geklickt!")
  gtk_main_quit()
end Sub

gtk_init (0, 0)

Dim Shared As GtkWidget ptr win_1        '- Als Variable nur in Sub verfügbar
  win_1 = gtk_window_new (GTK_WINDOW_TOPLEVEL)
  gtk_window_set_title (GTK_WINDOW (win_1), "Test")
  gtk_window_move (GTK_WINDOW (win_1), 300, 100)
  gtk_window_resize (GTK_WINDOW (win_1), 300, 200)

Dim Shared As GtkWidget ptr button_1     '- Als Variable nur in Sub verfügbar
  button_1 = gtk_button_new_with_label("Button 1")
  g_signal_connect(GTK_OBJECT(button_1),"clicked",G_CALLBACK(@callback_1),0)

Dim Shared As GtkWidget ptr button_2     '- Als Variable nur in Sub verfügbar
  button_2 = gtk_button_new_with_label("Button 2")
  g_signal_connect(GTK_OBJECT(button_2),"clicked",G_CALLBACK(@callback_2),0)

Dim Shared As GtkWidget ptr button_3     '- Als Variable nur in Sub verfügbar
  button_3 = gtk_button_new_with_label("Beenden")
  g_signal_connect(GTK_OBJECT(button_3),"clicked",G_CALLBACK(@callback_3),0)

Dim Shared As GtkWidget Ptr label_1      '- Als Variable nur in Sub verfügbar
  label_1 = gtk_label_new("_______")
  TextToLabel("Kein Button geklickt!")

Dim Shared As GtkWidget Ptr text_1      '- Als Variable nur in Sub verfügbar
  text_1 = gtk_text_new(0, 0)
  gtk_text_set_editable(GTK_Text(text_1), TRUE)
  gtk_text_set_line_wrap(GTK_Text(text_1), False)

Dim Shared As GtkWidget Ptr hscrollbar_1      '- Als Variable nur in Sub verfügbar
  hscrollbar_1 = gtk_hscrollbar_new(GTK_Text(text_1) -> vadj)

Dim Shared As GtkWidget Ptr vscrollbar_1      '- Als Variable nur in Sub verfügbar
  vscrollbar_1 = gtk_vscrollbar_new(GTK_Text(text_1) -> vadj)


dim Shared As GtkWidget ptr  hbox_1      '- Als Variable nur in Sub verfügbar
  hbox_1 = gtk_hbox_new(FALSE,0)
  gtk_container_add (GTK_CONTAINER(hbox_1), text_1)
  gtk_box_pack_end (GTK_BOX(hbox_1), vscrollbar_1, FALSE, FALSE, 0)

dim Shared As GtkWidget ptr  vbox_1      '- Als Variable nur in Sub verfügbar
  vbox_1 = gtk_vbox_new(FALSE,2)
  gtk_container_add (GTK_CONTAINER(vbox_1), button_1)
  gtk_container_add (GTK_CONTAINER(vbox_1), button_2)
  gtk_container_add (GTK_CONTAINER(vbox_1), button_3)
  gtk_container_add (GTK_CONTAINER(vbox_1), label_1)
  gtk_container_add (GTK_CONTAINER(vbox_1), hbox_1)
  gtk_container_add (GTK_CONTAINER(vbox_1), hscrollbar_1)

gtk_container_add (GTK_CONTAINER (win_1), vbox_1)

gtk_widget_show_all (win_1)

gtk_main()

Sub TextToLabel(Text As String)
 gtk_label_set_text (GTK_LABEL(label_1), Text)

End Sub

 

Zusätzliche Informationen und Funktionen
  • Das Tutorial wurde am 07.02.2010 von MitgliedStueber angelegt.
  • Die aktuellste Version wurde am 12.04.2010 von Mitgliedrieselkalk gespeichert.
  Bearbeiten Bearbeiten  

  Versionen Versionen