Setelah berkenalan dengan signal dan event, sekarang kita akan mencoba memasukkan komponen-komponen seperti tombol, label, dan sebagainya ke dalam window. Dalam GTK+, komponen ini disebut dengan Widget. Untuk menampung komponen, dibutuhkan sebuah container dan Window adalah contoh salah satu container.

Langsung saja.. perhatikan kode di bawah ini.

import gtk

def keluar(pemanggil):
    gtk.main_quit()

win = gtk.Window()
win.resize(100, 50)
win.connect("destroy", keluar)

btn = gtk.Button("keluar")
btn.connect("clicked", keluar)
btn.show()
win.add(btn)

win.show()

gtk.main()

Simpan ke dalam berkas (misalnya 03a.py) dan jalankan seperti biasa. Anda akan menjumpai tampilan seperti gambar berikut.

Pada kode di atas, dapat dilihat ada sebuah objek bernama “btn” yang dibuat dari kelas “gtk.Button”. Constructor dari kelas tersebut adalah label bagi tombol. Tombol tersebut memiliki signal “clicked” yang dihubungkan dengan fungsi “keluar”. Dua baris berikutnya adalah yang akan dibahas lebih lanjut.

btn.show()

Perintah di atas digunakan untuk menampilkan widget. Jika method show() tidak dipanggil, maka widget tidak akan ditampilkan walau sudah dimasukkan ke dalam container.

win.add(btn)

Berhubung “window” adalah sebuah container, maka objek tersebut dapat digunakan untuk menampung widget. Cara memasukkannya adalah dengan memanggil method “add()” dan menjadikan widget sebagai parameternya.

Sederhana bukan?

Container

Pertanyaan berikutnya adalah bagaimana memasukkan lebih dari satu Widget ke dalam container? Apakah bisa dilakukan dengan memanggil method “add()” beberapa kali? Menurut dokumentasi mengenai Container, ada dua jenis container, yaitu container yang hanya dapat menampung 1 buah Widget dan container yang dapat menampung lebih dari 1 Widget.

Jika melihat hirarki kelas, container yang diturunkan dari kelas “gtk.Bin” hanya dapat menampung satu buah widget. Contoh container jenis ini adalah “gtk.Window” dan “gtk.Frame”. Container jenis lainnya adalah container yang dapat digunakan untuk menampung lebih dari satu widget yang biasa digunakan untuk mengatur susunan Widget. Contoh container jenis ini adalah “gtk.VBox”, “gtk.HBox”, dan “gtk.Table”

Daripada cuma ngeliatin tulisan abstrak, mari kita lihat kode berikut ini. Simpan juga dalam berkas dan beri nama (misalnya) 03b.py.

import gtk

def keluar(pemanggil):
    gtk.main_quit()

def cetak(pemanggil):
    nama = teks.get_text()
    print "Nama: " + nama

label = gtk.Label("Nama")
teks = gtk.Entry()

btn = gtk.Button("OK")
btn.connect("clicked", cetak)

box = gtk.HBox()
box.pack_start(label, expand=False, padding=5)
box.pack_start(teks)
box.pack_start(btn, expand=False) 

win = gtk.Window()
win.connect("destroy", keluar)
win.add(box)
win.show_all()

gtk.main()

Dalam contoh di atas, kita membuat tiga buah widget yang masing-masing berasal dari kelas “gtk.Label”, “gtk.Entry”, dan “gtk.Button”. Selain itu kita membuat sebuah container dari kelas “gtk.HBox” yang digunakan untuk mengatur posisi Widget secara horizontal. Hasil eksekusi dapat dilihat pada gambar berikut.

Method “pack_start()” digunakan untuk memasukkan Widget ke dalam container. Ada dua parameter (dari tiga parameter) tambahan yang dimasukkan dalam contoh di atas, yaitu “expand” dan “padding”. Parameter “expand” digunakan untuk mengatur apakah ukuran Widget akan ikut mengembang jika ukuran container diubah. Sedangkan parameter “padding” digunakan untuk mengatur jarak Widget dengan tepian kotak. Referensi lebih lanjut silakan baca [2] dan [3].

Ada satu method baru yang diperlihatkan pada contoh kode di atas, yaitu “show_all()”. Method ini digunakan untuk memanggil method “show()” dari seluruh Widget yang berada di dalam sebuah Widget yang berupa Container sehingga kita tidak perlu memanggil method “show()” satu-persatu untuk menampilkan Widget. Dalam contoh di atas, seluruh Widget yang berada di dalam window akan ditampilkan.

Yapp.. itulah sekelumit mengenai Widget dan Container. Kalau kurang, silakan baca tutorial dan referensi PyGTK :D

PS: tau kan beda Widget dengan Gadget? kalau belum, silakan kunjungi http://youtube.com/watch?v=TaIUkwPybtM :P

Referensi:

1. http://www.pygtk.org/docs/pygtk/class-gtkcontainer.html
2. http://www.pygtk.org/docs/pygtk/class-gtkbox.html
3. http://www.pygtk.org/docs/pygtk/class-gtkhbox.html
4. http://www.pygtk.org/docs/pygtk/class-gtklabel.html
5. http://www.pygtk.org/docs/pygtk/class-gtkentry.html
6. http://www.pygtk.org/docs/pygtk/class-gtkbutton.html

< sebelumnya