Membuat User Interface

Pemrograman Visual Basic adalah suatu pemrograman visual, dimana pembuatan program dilakukan menggunakan media visual atau sering disebut dengan user-interface. Yang artinya bahwa pembuatan program berdasarkan tampilan yang dihasilkan program, dengan kode-kode program (Script) diletakkan masing-masing komponen.
Contoh 1:
Buat project baru dengan StandartEXE untuk membuat User Interface sederhana dengan melibatkan komponen Label, Textbox dan CommandButton yang ada di Toolbox pada sebelah kiri dari antar muka Visual Basic seperti gambar 2.1 dan gambar 2.2 berikut:

Gunakan komponen-komponen seperti pada gambar 2.1 untuk membuat form pada gambar 2.2. berikut:

Gambar 2.2

Untuk mengatur letaknya tinggal menggunakan “drag & drop” dengan mouse. Program ini belum selesai karena masih perlu pengaturan property dan penambahan event pada masing-masing komponen untuk dapat memberikan tampilan yang dapat diterima oleh user dan dapat menjalankan proses.

Mengatur Property

Property pada tampilan antar muka Visual Basic terletak di sebelah kanan, seperti gambar 2.3 berikut:

Contoh 2:

Pada contoh 1 di atas, komponen-komponen yang sudah digunakan adalah Label1, Label 2, Text1, Command1 dan Command2. Atur property masing-masing komponen tersebut sebagai berikut, sehingga menghasilkan tampilan seperti gambar 2.4.

Tabel 2.1. Pengaturan property contoh 2

Hasil form setelah propertynya di atur adalah:

Gambar 2.4. Hasil tampilan form contoh 2

Masing-masing komponen mempunyai property yang berbeda dan jumlahnya banyak, tetapi ada beberapa property yang sering digunakan pada setiap komponen, antara lain [Caption]. Property yang sering digunakan untuk Form antara lain:

• Name: menyatakan nama obyek form yang sangat berguna untuk memanggil dan menyimpan form.

• Caption: digunakan untuk memberikan title pada form.

• StartUpPosition: digunakan untuk meletakkan form ketika form tersebut dipanggil atau aktif. Ada empat pilihan yaitu: Manual, CenterOwner, CenterScreen, Windows Default,

Event Dengan Kode Program

Pemrograman visual bersifat event-driver, yang artinya program bekerja berdasarkan event yang terjadi ketika suatu object diberikan aksi misalkan tombol ditekan, option dipilih, atau setelah mengetikkan sesuatu pada text kemudian di tekan [Enter]. Untuk membuat event ini tinggal click pada komponen dari tampilan user interface yang sudah dibuat.

Contoh 3:

Pada tampilan contoh 2, click pada form (bagian kosong yang tidak digunakan komponen-komponen lainnya), maka akan muncul tampilan seperti gambar 5 berikut:

Gambar 2.5. Tampilan untuk kode program

Perhatikan gambar 2.5, ketika form di-click maka akan muncul event Load, ini disebabkan event default untuk form adalah load. Dan secara otomatis di bagian kode program sudah disediakan fungsi untuk event load pada form yang tertulis:

                                                                Private Sub Form_Load()

                                                                End Sub

Di dalam fungsi ini dituliskan kode program. Kode program ini dijalankan ketika form dipanggil. Event ini bisa diganti di bagian [Event], perhatikan bahwa event pada setiap komponen termasuk form jumlahnya banyak, tinggal dipilih sesuai kebutuhan aplikasi.

Contoh 4:

Pada tampilan contoh 2, click pada command1, sehingga muncul event pada bagian kode program sebagai berikut:

                                                                 Private Sub Command1_Click()

                                                                 

                                                                 End Sub

Tambahkan program pada kode program ini sehingga menjadi:

                                                                 Private Sub Command1_Click()

                                                                 Label2.Caption = Text1.Text

                                                                 End Sub

Program ini berarti bahwa apa yang diketikkan pada text1 akan ditampilkan pada label2.

Kemudian click pada command2, dan tambahkan kode program sehingga menjadi:

                                                                 Private Sub Command2_Click()

                                                                 End

                                                                 End Sub

Perintah End, berarti program keluar dan selesai.

Simpan form dan project ini dengan cara pilih menu [File] >> [Save Project], beri nama form dengan formLatihan21 dan nama project dengan projectLatihan21.

Jalankan dengan menekan ikon Run () pada toolbar. Masukkan nama misalnya “Achmad Basuki” pada text1, dan tekan tombol Ok. Hasilnya adalah seperti gambar 2.6 berikut.

Gambar 2.6. Hasil program latihan 2.1