Untuk mengenal lingkungan kerja lebih lanjut, marilah membuat aplikasi sederhana, yaitu Salam Nama. Aplikasi ini akan meminta pengguna mengetikkan namanya, kemudian aplikasi akan menampilkan nama tersebut pada kotak pesan (message box). Untuk membuat aplikasi, ikuti langkah berikut :
1. Buatlah sebuah proyek baru dengan cara berikut :
- Melalui Start Page New Project. Atau,
- Melalui Menubar File New Project. Atau,
- Melalui Toolbar New Project (ikon paling kiri). Atau,
- Melalui shortcut key dengan menekan CTRL+N.
|
Gambar 1. Membuat menu melalui Start Page |
|
Gambar 2. Membuat Menu Melalui Menubar |
2. Selanjutnya akan terbuka jendela New Project, pilih pada bagian Recent Templates
Visual Basic Windows, kemudian pilih template yang digunakan, yaitu Windows Form Application. Berilah nama proyek tersebut dengan “Salam Nama” pada textbox Name bagian bawah. Klik tombol OK.
|
Gambar 3. Jendela Dialog New Project |
IDE akan membuat aplikasi Windows kosong Windows kosong atau Windows Form atau sering disebut form saja dengan nama Form1.vb dan membuka beberapa jendela.
|
Gambar 5. Hasil Pembuatan Proyek Salam Nama |
I. JENDELA PADA VISUAL STUDIO 2010
Setelah Anda membuat sebuah proyek dengan template Windows Form Application seperti terlihat pada gambar 5. di atas, muncul beberapa jendela yang digunakan untuk pemrograman Visual Basic 2010, antara lain Toolbox, Data Sources, Design, Solution Explorer, Team Explorer dan Properties.
Di bawah ini penjelasan dari jendela-jendela tersebut :
Jendela |
Keterangan |
Toolbox |
Jendela ini berisi kontrol dan komponen yang dapat digunakan sewaktu-waktu dengan menambahkannya ke dalam aplikasi. Terdapat 12 group komponen sesuai dengan kegunaan masing-masing |
Design |
Jendela ini menampilkan form yang Anda buat dan di sini pula Anda mendesain tampilan dari aplikasi Anda. Jendela ini merupakan jendela utama yang paling besar terletak di tengah IDE |
Solution Explorer |
Jendela ini menampilkan hierarki dari solution Anda. Sebuah solution dapat berisi banyak proyek, dimana proyek dapat mengandung banyak form, kelas, modul, dan komponen lain untuk menyelesaikan masalah. |
Properties |
Jendela ini menampilkan properti dari obyek yang terpilih pada jendela Design. Dengan jendela Properties ini Anda dapat mengubah properti objek terpilih. Selain itu Anda juga dapat mengaturnya melalui kode. |
Data Sources |
Jendela ini digunakan untuk memanipulasi data source yang berhubungan dengan database. |
II. JENDELA PROPERTIES
Selanjutnya adalah mengatur properti dari aplikasi yang akan Anda buat, yaitu mengubah nama form dan mengubah judul/title form agar sesuai dengan fungsinya. Untuk itu lakukan langkah berikut :
1. Pada proyek yang Anda buat, klik file Form1.vb yang terdapat pada jendela solution explorer. Lihat gambar berikut :
|
Gambar 6. Jendela Properties Form1.vb |
2. Nama Form1.vb merupakan nama fisik file form yang tercipta. Sekarang cobalah untuk mengubah nama tersebut menjadi SalamNama.vb pada textbox File Name. Anda akan melihat pada jendela Solution Explorer nama Form1.vb diubah menjadi SalamNama.vb.
3. Klik form yang terdapat pada jendela design. Anda akan melihat jendela properties menampilkan properti form tersebut seperti berikut :
|
Gambar 7. Properties Form Salam Nama |
4. Ubah judul form melalui properti Text, ubah “Form1” menjadi “Salam Dari Visual Basic 2010”. Anda dapat melihat pada jendela design perubahan judul form tersebut.
5. Jalankan aplikasi tersebut dengan salah satu cara berikut :
- Melalui Toolbar, pilih ikon segitiga berwarna hijau
- Melalui menubar Debug Start Debugging.
- Melalui shortcut key, tekan F5.
6. Anda akan melihat jendela kosong dengan titlebar tertulis “Salam Dari Visual Basic 2010” seperti berikut :
|
Gambar 8. Hasil Eksekusi Form SalamNama.vb |
III. JENDELA TOOLBOX
Toolbox merupakan jendela yang berisikan group dari bermacam-macam kontrol dan komponen yang dapat dipasang di dalam form. Kontrol seperti Textbox, Button, Radio Button, Checkbox, Combo Box dan lain-lain ditambahkan ke dalam form dengan cara drag dan drop, atau mengklik dan menggoreskannya pada form. Lihat Toolbox pada gambar di bawah :
|
Gambar 9. Toolbox |
Pemberian nama sebuah kontrol
MDI : Multiple Document Interface
- Aplikasi MDI memungkinkan kita untuk menampilkan lebih dari satu dokumen (form) dalam 1 waktu dimana tiap dokumen / form ditampilkan dalam windows masing-masing.
- Aplikasi MDI seringkali memiliki menu (windows menu) dan submenu-nya untuk beralih antar windows atau dokumen atau form.
- Pada MDI application terdapat:
- MDI Form (Parent form), yang berlaku sbg container
- Form (Child form), selalu berada didalam MDI Form. Contoh:
- Dasar dari Aplikasi MDI adalah MDI Parent form.
- Parent Form adalah form yang akan menampung form-form lain yang ada di aplikasi yang dikenal sebagai sub-form atau child form.
- Dalam satu aplikasi tidak bisa ada 2 Parent Form.
Membuat aplikasi MDI dengan menu dan shortcut
a. Membuat aplikasi MDI pada saat runtime:
- Membuat Parent Form
- Buat aplikasi windows
- Pada properti form1, set properti IsMDIContainer menjadi true.
- Ini akan merubah form1 menjadi container form-form lain atau dikenal juga sebagai Parent Form.
b. Menambah menu pada MDI Form
- Dari Toolbox, drag kontrol MenuStrip
- Buat top-level menu, ketik &Berkas pada bagian “Type Here”
- Lalu buat sub-menu &Baru dan &Tutup dibawah &Berkas.
- Buat 1 lagi top-level menu &Windows
- Isi Property “Shortcut key” pada masing-masing menu untuk membuat shortcut.
- Misal, pada &Berkas, set shortcut key=“Control + B”
c. Membuat Sub Form atau Child Form
- Pada project yang sedang dikerjakan, lakukan langkah-langkah untuk menambah Form baru:
- Di Solution explorer, klik-kanan di project->Add->Add New Item. Akan tampil form2, ini yang akan menjadi template dari child form.
- Pada form yang baru di tambahkan, tambahkan control RichTextBox.
- Isi Property RichTextBox
- l anchor = Top, Left.
- l Dock = Fill.
- Ini akan membuat RichTextBox menutupi semua permukaan form bahkan ketika form di resize.
- Kita bisa mengisi kontrol apapun di atas child form, bukan hanya RichTextBox.
d. Menampilkan form sebagai Child Form:
- Double-click menu Berkas->Baru, maka akan terbuka code windows untuk mengisi perintah bila kita memilih menu Berkas->Baru.
- Isi dengan:
- Run aplikasi, dan pilih menu Berkas->baru beberapa kali, lihat hasilnya.
e. Membuat list Child Windows:
- Tambahkan code sebagai berikut pada event Parent form Form load:
- Me.MenuStrip1.MdiWindowListItem = Me.MenuStrip1.Items(1)
- MDIWindowsListItem menentukan menu mana yang akan menampilkan list child windows.
- MenuStrip1.Items(1) adalah menu &Windows yang telah kita buat.
f. Mengatur (Arranging) Child Windows di MDI Application:
- Pada menu “Windows” tambahkan untuk mengatur child windows yang terdapat pada MDI Application kita:
Menu |
Artinya |
Arrange &Icons |
All MDI child icons are arranged within the client region of the MDI parent form. |
&Cascade |
All MDI child windows are cascaded within the client region of the MDI parent form. |
Tile &Horizontal |
All MDI child windows are tiled horizontally within the client region of the MDI parent form. |
Tile &Vertical |
All MDI child windows are tiled vertically within the client region of the MDI parent form. |
- Tambahkan code sebagai berikut pada masing2 menu
Menu | Artinya |
Arrange &Icons | All MDI child icons are arranged within the client region of the MDI parent form. |
&Cascade | All MDI child windows are cascaded within the client region of the MDI parent form. |
Tile &Horizontal | All MDI child windows are tiled horizontally within the client region of the MDI parent form. |
Tile &Vertical | All MDI child windows are tiled vertically within the client region of the MDI parent form.
|
- Run Aplikasi, buka beberapa child form, lalu jalankan menu Arrange Windows satu persatu.
g. Mengirim data ke Child Windows yang sedang aktif:
- Buat satu menu lagi dibawah menu “Berkas” dengan text=“Isi &Rich Text Box”
- Tambahkan code sebagai berikut dibawah menu tersebut:
- Me.ActiveMdiChild.Controls(0).Text = "Saya adalah mahasiswa Universitas Mercu Buana“
- ActiveMdiChild adalah object (dalam hal ini form) yang sedang aktif.
- Controls(0) tertuju pada control pertama yang terdapat pada form yang sedang aktif, dalam hal ini adalah RichTextBox1.
- Bila ada lebih dari satu control diatas form tersebut, maka bisa jadi Controls(1), Controls(2) dan seterusnya.
Sekian artikel tentang
Membuat Aplikasi Sederhana di Visual Basic 2010.