Membuat User Interface (UI) Di Visual Basic 6.0
Aktifkan VB 6 melalui tombol Start.
Kenali jenis-jenis komponen (control) yang ada di dalam bagian ToolBox :
Kenali jenis-jenis komponen (control) yang ada di dalam bagian ToolBox :
Pada Jendela Form buatlah UI seperti ini :
Cara membuatnya :
Klik komponen Label di dalam ToolBox kemudian “gambar” object Label1 di dalam Form dengan cara
drag-drop. Lakukan langkah yang sama untuk object Label2. Object Text1 di-“gambar” menggunakan
komponen TextBox, sedangkan object Command1 dan Command2 menggunakan komponen Command
Button.
Melalui Jendela Properties atur property setiap object sebagai berikut :
Object
|
Properties
|
Value
|
From1
|
Caption
StartUpPosition
|
Property
Test
2 –
CenterScreen
|
Label1
|
Caption
|
Tuliskan
nama Anda :
|
Text1
|
-
|
-
|
Label1
|
Alignment
BackColor
Font
|
2
– Center
Palette:
<putih>
Size:
24
|
Command1
|
Caption
|
Ok
|
Command2
|
Caption
|
Selesai
|
Sehingga UI-nya menjadi seperti ini :
Menulis Kode Program : Property Test
Buka Jendela Code dan kenali bagian-bagian di dalamnya :
Program yang berbasis Windows bersifat event-driven, artinya program bekerja berdasarkan event yang
terjadi pada object di dalam program tersebut. Misalnya, jika seorang user meng-klik sebuah tombol
maka program akan memberikan “reaksi” terhadap event klik tersebut. Program akan memberikan
“reaksi” sesuai dengan kode-kode program yang dibuat untuk suatu event pada object tertentu.
Pilih object Command1 pada bagian
Private Sub Command1_Click()
End Sub
End Sub
Event Click merupakan event default (standar) dari object Command1, Anda bisa melihat event lainnya
pada bagian Event Selector.
Pada bagian Code Editor ketikkan kode programnya sebagai berikut :
Private Sub Command1_Click()
Label2.Caption = Text1.Text
End Sub
Private Sub Command2_Click()
End
End Sub
Label2.Caption = Text1.Text
End Sub
Private Sub Command2_Click()
End
End Sub
Simpan Project1 (nama file : Latihan.vbp) dan Form1 (nama file : Lat1.frm). VB 6 akan menyimpan
program yang Anda buat ke dalam beberapa file yang saling terkait, antara lain : file project (*.vbp), file
form (*.frm) dan file module (*.bas).
Coba jalankan Project1 dengan meng-klik tombol Start ( ) pada bagian Toolbar atau tekan tombol
F5 pada keyboard. Ketikkan “Salman” di dalam TextBox kemudian klik tombol OK. Maka akan tampil
hasil sebagai berikut :
Bila ingin keluar klik tombol Selesai.
Penjelasan kode program :
Berikut diberikan penjelasan bagaimana cara kerja program sederhana di atas
Private Sub Command1_Click()
Label2.Caption = Text1.Text
End Sub
Label2.Caption = Text1.Text
End Sub
Ketika seorang user meng-klik tombol OK (object Command1) maka isi tulisan pada object Label2 akan
sama dengan isi tulisan pada object Text1. Property Caption pada obyek Label2 digunakan untuk
menampilkan text tertentu di obyek tersebut.
Selanjutnya untuk keluar dari program dituliskan kode berikut :
Private Sub Command2_Click()
End
End Sub
End
End Sub
Ketika seorang user meng-klik tombol Selesai (object Command2) maka program akan berhenti.
Perintah End digunakan untuk menutup program.
Menampilkan tulisan merupakan salah satu property yang dimiliki oleh komponen Label. Property isi
tulisan pada komponen Label adalah Caption, sedangkan pada komponen Textbox adalah Text.
Cara penulisan (syntax) kode program untuk mengatur property sebuah object adalah sebagai berikut :
nama_object.property = value
Perhatikan, setelah Anda mengetikkan tanda titik (dot) dibelakang nama_object maka VB 6 akan
menampilkan daftar property dan method yang dimiliki oleh nama_object :
Fasilitas ini disebut Intellisense, dan sangat membantu Anda agar tidak salah mengetikkan nama_object maupun property-nya.
Modifikasi Kode Program
Ubah tampilan UI-nya menjadi seperti ini :
(Tambahkan komponen Frame, OptionButton dan CheckBox)
Atur property object-object tambahannya sebagai berikut :
Object
|
Properties
|
Value
|
Frame1
|
Caption
|
Pilihan
|
Option1
|
Caption
|
Biru
|
Option2
|
Caption
|
Merah
|
Check1
|
Caption
|
Tebal
|
Check2
|
Caption
|
Miring
|
Obyek Frame1 harus dibuat terlebih dahulu si form, dan selanjutnya obyek Option dan Check dibuat di
dalam Frame1 tersebut. Tujuan pembuatan berbagai pilihan tersebut adalah memperkenalkan pada Anda fasilitas Option dan CheckBox yang digunakan untuk membuat pilihan dalam aplikasi.
Tambahkan kode programnya sebagai berikut :
Private Sub Option1_Click()
Label2.ForeColor = vbBlue
End Sub
Private Sub Option2_Click()
Label2.ForeColor = vbRed
End Sub
Private Sub Check1_Click()
Label2.FontBold = Check1.Value
End Sub
Private Sub Check2_Click()
Label2.FontItalic = Check2.Value
End Sub
Label2.ForeColor = vbBlue
End Sub
Private Sub Option2_Click()
Label2.ForeColor = vbRed
End Sub
Private Sub Check1_Click()
Label2.FontBold = Check1.Value
End Sub
Private Sub Check2_Click()
Label2.FontItalic = Check2.Value
End Sub
Simpan kembali Form1, kemudian coba jalankan Project1 dan lihat hasilnya :
ini hasil dari sebuah program yang kita rancang dengan seksama, semoga dapat bermanfaat bagi penggunanya. jika ada yang ingin dipertanyaakan silahkan tinggalkan komentar anda dikomentar
0 Response to "Membuat User Interface (UI) Di Visual Basic 6.0"
Post a Comment