Form dan Kontrol
Pada bab-bab sebelumnya kita telah sering menggunakan form
maupun kontrol. Kita menggunakan form sebagai cara untuk
berinteraksi dengan pengguna/user. Dengan form, kita bisa
menciptakan berbagai macam aplikasi. Pada form kita dapat
menambahkan kontrol-kontrol, seperti text box, command button,
check box, option button, dan sebagainya untuk melengkapi aplikasi
yang akan kita buat. Untuk mengatur fungsi-fungsi yang akan
dijalankan oleh masingmasing kontrol, kita menggunakan kode program
pada VBA. Dalam kode program inilah kita menggunakan variabel,
konstanta, operator, fungsi, prosedur, percabangan, perulangan, dan
sebagainya yang telah dijelaskan pada bab-bab sebelumnya.
5.1
Form
Pada bagian ini kita akan mempelajari lebih dalam tentang form,
dimulai dari pengenalan form sebagai objek beserta
atributatributnya, cara membuat form serta menciptakan
aplikasiaplikasi dengan form.
91
5.1.1
Objek Form
Seperti yang telah kita ketahui pada bab sebelumnya, form juga
merupakan sebuah objek. Setiap objek memiliki properties, methods,
serta events. Berikut ini daftar dari properties, methods, dan
events yang biasanya digunakan dalam form. Properti-properti yang
biasa digunakan dalam form: Nama Property Caption FitToScreen
Visible Deskripsi Mengatur atau mengambil judul/teks pada bagian
atas form. Untuk mengatur agar ukuran form sesuai dengan layar.
Mengatur apakah form tersebut dapat dilihat (visible = true) atau
tidak dapat dilihat (visible = false). Mengatur lebar form.
Width
Method-method yang biasa digunakan dalam form: Nama Methods
Refresh Set Focus Deskripsi Meng-update isi form apabila terjadi
perubahan. Mengatur fokus agar berada pada form yang dimaksud.
Event-event yang biasa digunakan dalam form: Nama Event Activate
Click Close Deskripsi Event ini terjadi saat form menjadi form yang
aktif (saat mendapat fokus). Event ini terjadi saat user mengklik
form. Terjadi saat form ditutup dan dipindahkan dari layar.
92
GotFocus KeyPress KeyDown KeyUp Load LostFocus Mouse Down Mouse
Up Resize Unload
Terjadi saat form mendapat fokus. Terjadi saat user menekan
keyboard dan melepasnya. Terjadi saat keyboard. user menekan tombol
tombol tombol pada pada pada
Terjadi saat user menekan keyboard dan melepasnya.
Terjadi saat form dipanggil/dibuka. Terjadi saat fokus tidak
lagi berada pada form. Terjadi pada mouse. saat user mengklik
tombol
Terjadi pada saat user mengklik tombol mouse dan melepasnya.
Terjadi apabila saat form terbuka dan ukurannya berubah. Terjadi
saat form ditutup.
5.2
Kontrol-Kontrol yang Sering Digunakan dalam Form
Kita telah mengetahui sekilas tentang beberapa kontrol yang
sering digunakan dalam form lewat contoh-contoh sebelumnya.
Kontrol-kontrol yang sudah pernah kita gunakan sebelumnya dalam
buku ini hanya merupakan sebagian kecil dari keseluruhan kontrol
yang tersedia. Sekarang kita akan mengenal lebih jauh mengenai
kontrol-kontrol yang tersedia untuk mendesain form.
5.2.1
Label
Label berguna untuk menampilkan teks yang tidak dapat diubah
pada saat program berjalan. Pada umumnya label bermanfaat untuk
memberikan nama pada suatu kontrol, oleh karena itu label 93
biasanya terhubung dengan kontrol lain. Kontrol-kontrol yang
biasanya terhubung dengan label, antara lain text box dan list box.
Namun, kita juga dapat menggunakan label secara independen tanpa
menghubungkannya dengan kontrol lain. Label secara otomatis akan
terbentuk jika kita menggunakan kontrol yang membutuhkan label
sebagai penamaannya, misalnya text box dan list box. Kita juga
dapat menggunakan label secara individu dengan cara klik tombol
Label pada bagian form design. Berikut ini tampilan tombol
Label.
Gambar 5.1. Tampilan Tombol Label pada Ribbon
Setelah mengklik tombol label, letakkan kontrol label tersebut
dalam form. Drag sesuai kebutuhan (ukurannya dapat disesuaikan
kemudian). Berikut ini contoh label yang berdiri sendiri yang
menjelaskan judul sebuah form, yaitu Data Customer.
Gambar 5.2. Tampilan Label Independen
94
Sekarang kita akan melihat contoh label yang terhubung dengan
kontrol text box. Klik tombol text box pada bagian design form.
Setelah itu, drag area yang diinginkan pada form. Kita akan
menemukan dua buah control terbentuk pada form, yaitu text box itu
sendiri dan sebuah label. Label ini berfungsi untuk menjelaskan isi
text box tersebut nantinya. Contohnya, label Nama menjelaskan bahwa
text box tersebut menyimpan nama.
Gambar 5.3. Tampilan Label yang Terhubung dengan Text Box
5.2.2
Text Box
Text Box merupakan kontrol yang berfungsi untuk menampung teks
yang diinputkan oleh user. Berikut ini tampilan letak tombol
textbox pada ribbon.
Gambar 5.4. Tampilan Letak Tombol Text Box pada Ribbon
95
Untuk lebih memahami tentang text box, mari kita lihat contoh
penggunaannya berikut ini. 1. Buatlah sebuah form baru. Untuk
membuat form kosong, klik tab Create kemudian klik tombol Form
Design. 2. Tambahkan tiga buah textbox ke dalamnya. 3. Atur
properti kontrol-kontrol tadi menjadi seperti berikut ini. Objek
Label Properti Caption Text Align Text Box Label Name Caption Text
Align Text Box Label Name Caption Text Align Text Box Name Setting
Nama Right Txt1 Nama 2 Right Txt2 Nama 3 Right Txt3
4. Tampilan desain form adalah seperti berikut.
96
Gambar 5.5. Tampilan Desain Form Contoh Text Box
5. Pada Visual Basic Editor tuliskan kode program berikut
ini.Private Sub txt1_GotFocus() txt1 = tampung tampung = txt1.Value
MsgBox tampung txt2 = "" txt3 = "" End Sub Private Sub
txt2_GotFocus() MsgBox tampung txt2 = tampung txt1 = "" txt3 = ""
End Sub Private Sub txt3_GotFocus() MsgBox tampung txt3 = tampung
txt1 = "" txt2 = "" End Sub
97
6. Perintah di atas berfungsi untuk memindahkan isi text box
txt1 ke text box lain yang kita klik. Cara kerjanya adalah pada
saat text box txt2 mendapatkan focus, maka isi txt1 akan ter-copy
ke dalam txt2 kemudian isi txt1 dihapus, sehingga kesannya terlihat
seperti isi txt1 berpindah ke txt2. Begitu juga halnya apabila kita
mengklik txt3, akan terlihat tulisan pada txt1 tadi akan berpindah
ke txt3. 7. Misalnya, kita memasukkan kata Helen pada txt1.
Tampilan form hasil adalah seperti pada Gambar 5.6. 8. Setelah itu,
tekan tombol Tab pada keyboard (beri focus pada txt2), hasilnya
akan terlihat seperti pada Gambar 5.7.
Gambar 5.6. Tampilan Form Hasil Saat User Menginputkan Helen
pada txt1
98
Gambar 5.7. Tampilan Form Hasil saat txt1 Kehilangan Focus
9. Apabila kita menekan tombol Tab sekali lagi, isi txt2 akan
berpindah ke txt3. Hasilnya dapat dilihat pada gambar berikut.
Gambar 5.8. Tampilan Form Hasil saat txt2 Kehilangan Fokus
5.2.3
Command Button
Command button digunakan untuk membuat tombol yang biasanya
berisi perintah. Berikut tampilan letak tombol command button pada
ribbon. 99
Gambar 5.9. Tampilan Letak Tombol Command Button pada Ribbon
Untuk lebih memahami tentang command button, mari kita lihat
contoh penggunaannya berikut ini. 1. Buatlah sebuah form baru.
Tambahkan satu buah textbox dan satu buah command button ke
dalamnya. 2. Atur properti kontrol-kontrol tadi menjadi seperti
berikut ini. Objek Label Properti Caption Text Align Text Box
Command Button Name Caption Alignment Name Setting Nama Right
txtNama Say Hello Center cmdHello
3. Tampilan desain form adalah sebagai berikut.
100
Gambar 5.10. Tampilan Desain Form Contoh Command Button
4. Pada Visual Basic Editor tuliskan kode program berikut
ini.Private Sub cmdHello_Click() MsgBox "Hello " &
txtNama.Value End Sub
5. Perintah di atas akan menampilkan message box yang berisi
Hello dan isi txtNama saat kita mengklik tombol Say Hello. 6.
Misalnya kita memasukkan Alicia pada txtNama. Tampilan form hasil
adalah seperti pada Gambar 5.11.
Gambar 5.11. Tampilan Form Hasil sesudah Tombol Say Hello
Diklik
101
5.2.4
List Box
List box merupakan kotak yang berisi daftar, misalnya daftar
nama, daftar kota, atau daftar pilihan. Berikut tampilan letak list
box pada ribbon.
Gambar 5.12. Tampilan Letak Tombol List Box pada Ribbon
Untuk lebih memahami tentang list box, mari kita lihat contoh
penggunaannya berikut ini. 1. Buatlah sebuah form baru. Tambahkan
satu buah list box, satu buah text box, dan satu buah command
button ke dalamnya. 2. Atur properti kontrol-kontrol tadi menjadi
seperti berikut ini. Objek Label Properti Caption Text Align Text
Box Command Button Name Caption Alignment Name Label Caption Text
Align Setting Menu yang dipilih Right txtMenu Pilih Menu Center
cmdPilih Daftar Menu Center
102
List Box
Name Row Source
lstMenu NasiGoreng;Nasi Uduk;Ayam Goreng;Ayam Bakar;Kentang
Goreng;Roti Bakar
3. Tampilan desain form adalah sebagai berikut.
Gambar 5.13. Tampilan Desain Form Contoh List Box
4. Pada Visual Basic Editor tuliskan kode program berikut
ini.Private Sub cmdPilih_Click() txtMenu.Value = lstMenu.Value End
Sub
5. Perintah di atas akan menampilkan menu yang kita pilih ke
dalam txtMenu. 6. Misalnya, kita memilih menu Kentang Goreng.
kemudian mengklik tombol Pilih Menu, maka kita dapat melihat bahwa
dalam txtMenu saat ini telah terisi dengan nilai Kentang Goreng.
Tampilan form hasil adalah seperti Gambar 5.14. 103
Gambar 5.14. Tampilan Form Hasil setelah Menu Dipilih dan Tombol
Pilih Menu Diklik
5.2.5
Combo Box
Combo box merupakan kombinasi antara list box dan text box. Kita
dapat memilih satu atau lebih pilihan dari dalam combo box dan juga
menambahkan item baru ke dalamnya. Tampilan letak combo box pada
ribbon adalah sebagai berikut.
Gambar 5.15. Tampilan Letak Tombol Combo Box pada Ribbon
Untuk lebih memahami combo box, mari kita lihat contoh
penggunaannya berikut ini. 1. Buatlah sebuah form baru. Tambahkan
satu buah combo box, satu buah textbox, dan satu buah command
button ke dalamnya. 104
2. Atur properti kontrol-kontrol tadi menjadi seperti berikut
ini. Objek Label Properti Caption Text Align Text Box Command
Button Name Caption Alignment Name Label Caption Text Align Combo
Box Name Setting Nama Kota Right txtNamaKota Input Nama Kota Center
cmdInput Daftar Kota Right cmbNamaKota
3. Tampilan desain form adalah sebagai berikut.
Gambar 5.16. Tampilan Desain Form Contoh Combo Box
4. Pada Visual Basic Editor tuliskan kode program berikut ini.
105
Private Sub cmdInput_Click() cmbNamaKota.AddItem
(txtNamaKota.Value) End Sub
5. Perintah di atas akan menambahkan daftar pada combo box
cmbNamaKota berdasarkan isi dari kotak teks txtNamaKota saat kita
mengklik tombol Input Nama Kota. 6. Misalnya, kita menginputkan
nama kota Surabaya pada kotak teks txtNamaKota, kemudian klik
tombol Input Nama Kota, maka saat kita melihat isi combo box, di
sana telah terdapat sebuah nama kota, yaitu Surabaya. Tampilan form
hasil adalah seperti pada Gambar 5.17.
Gambar 5.17. Tampilan Form Hasil setelah Tombol Input Nama Kota
Diklik
7. Sekarang kita akan menginputkan nama kota Manado dalam kotak
teks txtNamaKota. 8. Klik tombol Input Nama Kota, kemudian lihat
isi combo box. Tampilannya dapat dilihat pada Gambar 5.18.
106
Gambar 5.18. Tampilan Form Hasil saat Daftar Kota Bertambah
5.2.6
Option Button
Option button digunakan untuk item pilihan, di mana kita hanya
dapat memilih satu dari sekian pilihan. Misalnya pilihan untuk
jenis kelamin, kita hanya dapat memberi tanda pada option pria atau
wanita. Option button harus diletakkan di dalam option group agar
user benar-benar hanya bisa memilih satu dari sekian pilihan.
Tampilan tombol option button dan option group dapat dilihat pada
Gambar 5.19.
Gambar 5.19. Tampilan Letak Tombol Option Button dan Tombol
Option Group pada Ribbon
Berikut contoh penggunaan option button: 107
1. Buatlah sebuah form baru. Tambahkan satu buah label, satu
buah command button, satu buah text box, dan satu buah option group
ke dalam form. Setelah itu, tambahkan dua buah option button ke
dalam option group. 2. Atur properti kontrol-kontrol tadi menjadi
seperti berikut ini. Properti Caption Text Align Option Group
Option Button Label Option Button Label Command Button Name Name
Caption Name Caption Name Caption Text Box Name Setting Jenis
Kelamin Right Frame1 optPria Pria optWanita Wanita cmdPilih Pilih
txtJenisKelamin
Objek Label
3. Tampilan desain form adalah sebagai berikut.
Gambar 5.20. Tampilan Desain Form Contoh Option Button
108
4. Pada Visual Basic Editor tuliskan kode program berikut
ini.Private Sub Form_Load() txtJenisKelamin.Value = "" End Sub
Private Sub cmdPilih_Click() If Frame1.Value = 1 Then
txtJenisKelamin.Value = "Pria" ElseIf Frame1.Value = 2 Then
txtJenisKelamin.Value = "Wanita" Else txtJenisKelamin.Value = ""
End If End Sub
5. Perintah di atas akan menampilkan isi option button yang kita
pilih ke dalam txtJenisKelamin saat kita mengklik tombol Pilih. 6.
Misalnya kita memilih option Pria, setelah itu mengklik tombol
Pilih. Tampilan form hasil adalah seperti Gambar 5.21.
Gambar 5.21. Tampilan Form Hasil saat Tombol Pilih Diklik
7. Sekarang kita memilih option Wanita, setelah itu mengklik
tombol Pilih. Tampilan form hasil adalah seperti Gambar 5.22.
109
Gambar 5.22. Tampilan Form Hasil saat Option Wanita Dipilih dan
Tombol Pilih Diklik
5.2.7
Check Box
Check box juga digunakan untuk item pilihan, namun kita dapat
memilih lebih dari satu pilihan dari sekian banyak pilihan.
Misalnya, untuk pilihan hobi, kita dapat menandai pada pilihan
membaca, jalan-jalan, dan mendengarkan musik secara bersamaan.
Tampilan letak tombol check box pada ribbon dapat dilihat pada
gambar berikut.
Gambar 5.23. Tampilan Letak Tombol Check Box pada Ribbon
Berikut contoh penggunaan check box. 1. Buatlah sebuah form
baru. Tambahkan satu buah check box, satu buah listbox, dan satu
buah command button ke dalamnya. 2. Atur properti kontrol-kontrol
tadi menjadi seperti berikut ini. 110
Objek Label List Box Command Button
Properti Caption Name Caption Alignment Name
Setting Hobi lstHobi Tambah Center cmdTambah Hobi chk1 Baca Buku
chk1 Dengar Musik chk2 Jalan-jalan chk3 Menjahit chk4 Memasak chk5
Utak Atik Komputer Hapus List Center cmdClear
Label Check Box Label Check Box Label Check Box Label Check Box
Label Check Box Label Check Box Label Command Button
Caption Name Caption Name Caption Name Caption Name Caption Name
Caption Name Caption Caption Alignment Name
3. Tampilan desain form adalah sebagai berikut.
111
Gambar 5.24. Tampilan Desain Form Contoh Check Box
4. Pada Visual Basic Editor tuliskan kode program berikut
ini.Private Sub cmdClear_Click() Dim i As Integer For i =
lstHobi.ListCount - 1 To 0 Step -1 lstHobi.RemoveItem (i) Next End
Sub Private Sub cmdTambah_Click() If chk0.Value = -1 Then
lstHobi.AddItem ("Baca Buku") End If If chk1.Value = -1 Then
lstHobi.AddItem ("Dengar Musik") End If If chk2.Value = -1 Then
lstHobi.AddItem ("Jalan-jalan") End If If chk3.Value = -1 Then
lstHobi.AddItem ("Menjahit") End If If chk4.Value = -1 Then
112
lstHobi.AddItem ("Memasak") End If If chk5.Value = -1 Then
lstHobi.AddItem ("Utak Atik Komputer") End If End Sub
5. Perintah di atas akan menambahkan hobi yang kita pilih pada
check box yang sudah ada ke dalam lstHobi saat kita mengklik tombol
Tambah. 6. Misalnya, kita memilih hobi Baca Buku, Dengar Musik dan
Utak Atik Komputer, setelah itu mengklik tombol Tambah. Tampilan
form hasil adalah seperti pada Gambar 5.25.
Gambar 5.25. Tampilan Form Hasil saat Tombol Tambah Diklik
7. Sekarang klik tombol Hapus List. Isi lstHobi akan terhapus
semua kembali dan tampilan form menjadi seperti berikut.
113
Gambar 5.26. Tampilan Form Hasil saat Tombol Hapus List
Diklik
5.3
Membuat Aplikasi Sederhana dengan Form dan Kontrol
Pada bagian sebelumnya kita telah mempelajari tentang form dan
kontrol yang dapat dibuat secara otomatis dari tabel atau query,
serta mengenai kontrol-kontrol yang biasanya digunakan dalam
aplikasi. Sekarang kita akan mempelajari cara membuat aplikasi
sederhana yang menggabungkan form serta kontrol-kontrol yang sudah
dijelaskan di atas. Kita akan membuat aplikasi sederhana untuk
membuat gambar segitiga dari tanda * dengan memanfaatkan kontrol
listbox. Ikuti langkah-langkah berikut ini: 1. Buatlah sebuah form
baru. Klik tombol Form Design pada tab Create. Lihat gambar berikut
ini.
114
Gambar 5.27. Tombol Form Design pada Tab Create
2. Tambahkan satu buah text box, satu buah list box, dan tiga
buah command button. Objek Label Text Box Command Button Properti
Caption Name Name Caption Command Button Name Caption Command
Button Name Caption Setting Jumlah txtJumlah cmdKclBsr Segitiga
Kiri Bawah cmdBsrKcl Segitiga Kiri Atas cmdHapus Hapus
3. Tampilan form yang kita buat adalah seperti Gambar 5.28.
115
Gambar 5.28. Tampilan Desain Form Aplikasi
4. Untuk kode programnya pada editor VBA adalah sebagai
berikut.Option Compare Database Dim i As Integer Dim j As Integer
Dim k As Integer Dim str As String Private Sub cmdBsrKcl_Click()
str = "" For i = Val(txtJumlah) To 1 Step -1 For j = 1 To i str =
str & "*" Next lstBintang.AddItem (str) str = "" Next End Sub
Private Sub cmdHapus_Click() For i = lstBintang.ListCount - 1 To 0
Step -1 lstBintang.RemoveItem (i) Next End Sub
116
Private Sub cmdKclBsr_Click() For i = 1 To Val(txtJumlah) For j
= 1 To i str = str & "*" Next lstBintang.AddItem (str) str = ""
Next End Sub Private Sub cmdKclKcl_Click() For i = 1 To
Val(txtJumlah) For j = 1 To (Val(txtJumlah) - i) str = str & ""
Next j For k = 1 To i str = str & "*" Next k lstBintang.AddItem
(str) str = "" Next i End Sub Private Sub Command6_Click()
txtJumlah = lstBintang.Value End Sub Private Sub Form_Load() str =
"" End Sub
5. Pada bentuk form view, masukkan jumlah baris yang akan
membentuk segitiga pada kotak teks Jumlah. 6. Setelah itu klik
tombol Segitiga Kiri Bawah untuk melihat hasilnya. Lihat pada
Gambar 5.29.
117
Gambar 5.29. Tampilan Form Hasil Setelah Tombol Segitiga Kiri
Bawah Diklik
7. Sekarang klik tombol Segitiga Kiri Atas. Tampilannya dapat
dilihat pada Gambar 5.30.
Gambar 5.30. Tampilan Form Hasil setelah Tombol Segitiga Kiri
Atas Diklik
118
8. Untuk membersihkan list box, klik pada tombol Hapus. Berikut
ini tampilannya.
Gambar 5.31. Tampilan Form Hasil setelah Tombol Hapus Diklik
---@@@---
119