GTK Programming : Menyusun Widget dengan GtkBox

Sebelumnya sudah dijelaskan bahwa GtkWindow termasuk dalam kategori 'container'(Klik disini untuk tutorial sebelumnya). Kita diperbolehkan untuk menambahkan/memasang widget lain di dalamnya. Kita sudah membuktikan hal ini pada tutorial sebelumnya, yaitu dengan memasang GtkButton pada GtkWindow dengan fungsi gtk_container_add(). GtkWindow hanya terbatas untuk menampung satu buah widget saja, sehingga untuk memiliki banyak widget dalam sebuah window, kita tidak dapat memakai fungsi gtk_container_add().
Program sederhana umumnya membutuhkan lebih dari 2 widget. Agar semua widget yang kita perlukan dapat terpasang pada window, kita membutuhkan bantuan widget container GtkBox. GtkBox merupakan salah satu widget dari golongan container yang mampu menampung lebih dari 1 buah widget.
GtkBox bekerja layaknya garis pembatas bagi widget. Widget yang dimasukkan dalam GtkBox akan menyesuaikan diri sesuai garis batasannya.

Let's Start
Pada tutorial kali imi kita akan mencoba membuat 2 buah tombol(GtkButton) dalam sebuah Window. Caranya adalah dengan memasang 2 tombol tersebut pada GtkBox lalu memasangkan GtkBox pada window. Perlu diingat bahwa widget GtkBox tidak dapat dilihat, namun perannya sangat penting dalam mengatur susunan widget secara sejajar dan teratur. Pembuatan GtkBox pada tutorial ini dilakukan dengan fungsi berikut.

#include<gtk/gtk.h>

int main(int argc, char *argv[])

{

    GtkWidget *window, *button1, *button2, *box;

    gtk_init(&argc, &argv);

    //buat window

    window = gtk_window_new(GTK_WINDOW_TOPLEVEL);

    gtk_window_set_title(GTK_WINDOW(window),"Hello world");

    //buat horizontal box

    box = gtk_box_new(GTK_ORIENTATION_HORIZONTAL, 10);

    //pasang hbox pada window

    gtk_container_add(GTK_CONTAINER(window), box);

    //buat button

    button1 = gtk_button_new_with_label("Button 1");

    button2 = gtk_button_new_with_label("Button 2");

    //pasang

    gtk_box_pack_start(GTK_BOX(box),button1,TRUE,TRUE,10);

    gtk_box_pack_start(GTK_BOX(box),button2,TRUE,TRUE,10);

    gtk_widget_show_all(window);

    gtk_main();

    return 0;

}

Cara kerja GtkBox pada kode di atas dapat dijelaskan dengan ilustrasi berikut.

1. GtkWindow baru dibuat
2. GtkBox dipasang pada GtkWindow
3. Menambahkan GtkButton pertama
4. Menambahkan GtkButton kedua
Bisa kita lihat pada tahap ke empat, widget yang bernaung pada GtkBox secara otomatis menyesuaikan diri.

Sebelu memasang GtkBox, tentunya kita harus membuatnya terlebih dahulu. GTK menyediakan fungsi gtk_box_new() untuk pembuatan GtkBox.

box = gtk_box_new(GTK_ORIENTATION_HORIZONTAL, 10);

Bentuk lengkap prototype fungsi diatas adalah sebagai berikut.

GtkWidget *gtk_box_new(GtkOrientation orientation, gint spacing);

orientation: cara penempatan widget pada box. Kita dapat menggunakan 2 metode, yaitu tegak lurus, vertikal (GTK_ORIENTATION_VERTICAL) atau juga bisa secara mendatar/horosontal (GTK_ORIENTATION_HORIZONTAL).
spacing: jarak pixel yang memisahkan antar widget yang telah terpasang dalam GtkBox.

Setelah GtkBox dibuat, pasang pada container window dengan fungsi htk_container_add().

gtk_container_add(GTK_CONTAINER(window), box);

Mungkin beberapa dari anda merasa ragu dengan fungsi diatas? window(GtkWindow) adalah container dan box(GtkBox) juga merupakan container. Kode diatas memasangkan box ke dalam window, benarkah demikian?
Yup, benar. Tidak ada yang salah, container mengizinkan pemasangan semua jenis widget, kecuali widget container berbasis window.

Untuk menambahkan kedua widget button yang kita inginkan dalam GtkBox, kita memakai fungsi berikut.

gtk_box_pack_start(GTK_BOX(box),button1,TRUE,TRUE,10);

gtk_box_pack_start(GTK_BOX(box),button2,TRUE,TRUE,10);

GtkBox tergolong dalam container, akan tetapi untuk memasang widget dalam GtkBox tidak boleh memakai fungsi 'gtk_container_add()', karena fungsi tersebut khusus untuk memasangkan widget pada container yang hanya mampu menampung satu buah widget, seperti GtkWindow. Sementara itu, GtkBox tidak membatasi jumlah widget, sehingga diperlukan metode yang berbeda.

Dalam pemasangan widget dalam container GtkBox, kita dapat menggunakan 2 macam fungsi:
1. gtk_box_pack_start()

void gtk_box_pack_start (GtkBox *box, GtkWidget *child, gboolean expand, gboolean fill, guint padding); 

2. gtk_box_pack_end()

void gtk_box_pack_end (GtkBox *box, GtkWidget *child, gboolean expand, gboolean fill, guint padding);

box: GtkBox yang akan dipasang widget
child: widget yang akan dipasang pada box
expand: jika bernilai benar ukuran widget dapat berubah sesuai perubaha ukuran window
fill: jika benar, ukuran widget akan menyesuaikan ukuran window
padding: Jarak pemisah tambahan yang memberikan jarak antar widget ayng terpasang dalam box

Kedua fungsi diatas memiliki fungsi yang sama. Perbedaannya terletak pada hasil penempatan widget pada container. Widget yang dipasang dengan gtk_box_pack_start() mendapat prioritas penempatan paling kanan atau paling bawah, begitu pula sebaliknya pada fungsi gtk_box_pack_end().

Setelah pembuatan dan pemasangan seleasai, kita boleh mulai menampilkan semua widget.

gtk_widget_show_all(window);

Proses penampilan window cukup menggunakan 1 fungsi, dengan parameter berisi container paling atas, yaitu window. Secara otomatis, gtk akan mencari widget lain yang terpasang dibawahnya.

Hasil
Penasaran dengan hasilnya?
Seperti inilah GtkBox berperan membantu kita dalam pemasangan widget :)