Pemrograman Pada Embedded Visual Basic

(1)

Pemrograman Pada Embedded Visual Basic Halaman 29

Pemrograman Pada

Embedded Visual Basic

Objektif :

• Mengenal Elemen-Elemen Pada Embedded Visual Basic • Mengetahui Fungsi Masing-Masing Elemen

3.1. Kontrol

Kontrol adalah sebuah object yang terdapat pada form tempat aplikasi Embedded Visual Basic ini dibuat. Setiap kontrol tersebut memiliki nilai-nilai properti, metode dan event tersendiri yang dapat membuat kontrol ini bekerja sesuai dengan fungsinya. Pada Embedded Visual Basic, kontrol tersebut dibagi menjadi kontrol standar dan kontrol-kontrol Active-X.

• Kontrol Standar

Tabel 3.3 Kontrol Standar

CheckBox Control ListBox Control ComboBox Control OptionButton Control CommandButton Control Scrollbar Control (Horizontal) (Vertikal) Frame Control Shape Control Label Control TextBox Control

3

(2)

Halaman 30 Pemrograman Pada Embedded Visual Basic

Line Control Timer Control

• Kontrol Active-X

Tabel 3.4 Kontrol ActiveX

Comm Control ImageList Control ListView Control CommonDialog Control MenuBar Control FileSystem Controls PictureBox Control TabStrip Control Grid Control TreeView Control Image Control Winsock Control

Selain beberapa kontrol diatas, terdapat juga beberapa kontrol yang diaktifkan dengan memilih salah satunya pada daftar komponen tambahan yang terdapat pada Embedded Visual Basic. Caranya adalah dengan mengaktifkan menu Project, Components. Kemudian pilihlah salah satu atau beberapa kontrol yang akan digunakan dengan cara men check-list nya. Jangan lupa menekan tombol OK untuk meyakinkan pilihan anda.

(3)

Gambar 3.1 Memilih komponen

Pada pengembangannya, terdapat banyak kontrol-kontrol lain buatan pihak ketiga yang dapat didownload di internet baik itu gratis atau bayar, sehingga variasi pembuatan aplikasi-pun dapat lebih banyak. Pemilihan kontrol yang tepat juga dapat mengoptimalkan penggunaan suatu aplikasi.

3.2. Menggunakan Kontrol Tabstrip

Kontrol TabStrip digunakan untuk memperbanyak pilihan tampilan pada satu halaman tampilan utama. Biasa digunakan untuk membuat beberapa pilihan konfigurasi pada satu form utama. Salah satu tujuan penggunaan kontrol TabStrip adalah untuk meminimalkan jumlah form tapi dapat mengakomodir halaman tampilan dengan jumlah yang banyak.

Kontrol TabStrip terdiri dari beberapa tab (satuan tampilan) yang dipanggil sesuai dengan index masing-masing tab tersebut. Tab-tab tersebut dapat diberi caption untuk memberi nama masing-masing tab. Pada caption tab-tab tersebut juga dapat disertakan gambar yang dipanggil dari kontrol ImageList.

(4)

Gambar 3.2 Contoh penggunaan kontrol TabStrip

Salah satu kelemahan menggunakan kontrol TabStrip adalah sulitnya menempatkan object-object yang akan diakomodir oleh TabStrip tersebut pada saat pembuatan. Hal itu disebabkan karena tidak adanya pemisah pada peletakkan object-objet tersebut, sehingga perlu dibuat suatu cara agar penggunaannya dapat dipermudah. Salah satu caranya adalah dengan menyertakan kontrol PictureBox untuk setiap tab pada kontrol TabStrip tersebut. Dan kemudian object-object tersebut diletakkan pada masing-masing frame tersebut sesuai dengan lokasi tab yang diinginkan. Sehingga, pada pembuatannya, kita tinggal mengatur frame-frame tersebut untuk ditampilkan atau tidak ditampilkan ketika tab yang mewakili frame tersebut dipilih.

Berikut ini merupakan contoh pembuatan aplikasi dengan menyertakan kontrol TabStrip. 1. Buat project baru untuk Pocket PC.

2. Tambahkan komponen Microsoft CE TabStrip Control 3.0 dengan memilihnya pada menu Project, Components. Microsoft TabStrip Control 3.0 secara default sudah diikutsertakan pada paket instalasi Microsoft Embedded Visual Basic 3.0

(5)

Properti Nilai

Project Name TabStrip

Remote Path \Windows\Start Menu\Project1.vb Run On Target Pocket PC 2002 Emulation

4. Buat form baru dan ubah properti seperti pada tabel dibawah ini :

Name frmUtama

Caption Contoh TabStrip

5. Pada form utama, tambahkan kontrol TabStrip dengan memilih icon pada ToolBox dan letakkan pada form seperti ini.

Name TabStrip

Enabled True

6. Untuk menambah jumlah dan memberi nama masing-masing TabStrip, masuklah pada Property Pages dengan cara klik kanan pada kontrol tersebut dan memilih Property. Dan isikan informasi yang diinginkan.

(6)

Isikanlah nilai-nilai properti seperti berikut ini, tekan Add Tab untuk menambah Tab baru :

Index Caption Key

1 Tab 1 TabSatu

2 Tab 2 TabDua

7. Setelah selesai mengatur TabStrip yang bersangkutan, sekarang kita tinggal membuat isi masing-masing TabStrip tersebut. Untuk memisahkan object-object yang ingin digunakan, gunakanlah kontrol Frame pada icon dan letakkan object-object tersebut pada masing-masing Frame untuk masing-masing Tab seperti berikut ini.

Berikanlah nilai properti seperti berikut ini untuk Frame pertama :

Kontrol Properti Nilai

Frame Name Frame1

Enabled True

Caption (Kosongkan)

BorderStyle 0 – vbBSNone

Label Name lblSatu

Caption Isi Tab Strip 1

TextBox Name txtSatu

CommandButton Name cmdSatu

Caption Button 1

Berikanlah nilai properti seperti berikut ini untuk Frame kedua :

Kontrol Properti Nilai

Frame Name Frame2

Enabled True

(7)

BorderStyle 0 – vbBSNone

Label Name lblDua

Caption Isi Tab Strip 2

CheckBox Name chkSatu

Caption Check Box 2

OptionButton Name optSatu

Caption Option 2

8. Tambahkan kode program seperti dibawah ini untuk mengatur peletakkan masing-masing frame atas TabStrip.

Kode Program 2.1

Private Sub Form_Load()

Frame1.Top = TabStrip1.ClientTop Frame1.Left = TabStrip1.ClientLeft Frame1.Height = TabStrip1.ClientHeight Frame1.Width = TabStrip1.ClientWidth Frame2.Top = TabStrip1.ClientTop Frame2.Left = TabStrip1.ClientLeft Frame2.Height = TabStrip1.ClientHeight Frame2.Width = TabStrip1.ClientWidth Frame1.ZOrder vbBringToFront End Sub

Kemudian tambahkan lagi kode program dibawah ini untuk mengatur efek yang terjadi jika tombol TabStrip ditekan.

Private Sub TabStrip1_Click()

Select Case TabStrip1.SelectedItem.Key Case "satu": Frame1.ZOrder vbBringToFront Case "dua": Frame2.ZOrder vbBringToFront End Select

End Sub

(8)

3.3. Menggunakan Kontrol Treeview

Kontrol TreeView biasa digunakan untuk menunjukkan hirarki atau urutan isi object-object. Urutan object-object tersebut dapat diatur apakah akan ditunjukkan atau tidak sesuai dengan keinginan. TreeView paling sering digunakan untuk menunjukkan hirarki file, yang terdapat pada folder-folder. Contohnya terdapat pada Windows Explorer.

(9)

Masing-masing elemen pada TreeView disebut dengan Node, pada Node tersebut dapat ditambahkan beberapa sub-node sebagai cabang dari node utama. Untuk setiap node juga dapat disertakan gambar yang dipanggil dari kontrol ImageList. Node-node tersebut dapat dibuka (expand) atau dapat pula di tutup (collapse) sesuai dengan keinginan.

Berikut ini merupakan contoh pembuatan aplikasi dengan menggunakan kontrol TreeView : 1. Buat project baru untuk Pocket PC.

2. Tambahkan komponen Microsoft CE TreeView Control 3.0 dengan memilihnya pada menu Project, Components. Microsoft CE TreeView Control 3.0 secara default sudah diikutsertakan pada paket instalasi Microsoft Embedded Visual Basic 3.0.

3. Ubah properti Project1 seperti pada tabel dibawah ini :

Project Name TreeView

Remote Path \Windows\Start Menu\Project1.vb Run On Target Pocket PC 2002 Emulation

Name frmUtama

Caption Contoh TreeView

5. Tambahkan kontrol TreeView pada frmUtama dengan memilih icon pada ToolBox. Ubah properti seperti pada tabel dibawah ini :

Name TreeView

(10)

6. Tambahkan kode program dibawah ini dengan cara klik dua kali pada frmUtama.

Private Sub Form_Load()

TreeView.Nodes.Add , , "HP", "Hewlett Packard" TreeView.Nodes.Add "HP", 4, "HP1", "HP iPAQ 1910" TreeView.Nodes.Add "HP", 4, "HP2", "HP iPAQ 2210" TreeView.Nodes.Add "HP", 4, "HP3", "HP iPAQ 4150" TreeView.Nodes.Add , , "O2", "O2"

TreeView.Nodes.Add "O2", 4, "O21", "O2 XDA" TreeView.Nodes.Add "O2", 4, "O22", "O2 X-Phone" End Sub

(11)

3.4. Menggunakan Kontrol Menubar

Kontrol MenuBar merupakan salah satu komponen yang paling sering digunakan pada aplikasi Pocket PC. MenuBar adalah suatu menu khusus yang dapat memberikan aksi-aksi tertentu jika dipilih. Menu tersebut juga dapat terdiri dari sub-sub menu didalamnya yang juga dapat diberi aksi jika dipilih. Lain halnya pada Microsoft Visual Basic yang memiliki Menu Editor untuk membuat menu, pada Embedded Visual Basic tidak terdapat. Berikut ini merupakan contoh pembuatan aplikasi dengan menyertakan kontrol MenuBar : 1. Buat project baru untuk Pocket PC.

2. Tambahkan komponen Microsoft PocketPC MenuBar Control 3.0 dengan memilihnya pada menu Project, Components. Microsoft PocketPC MenuBar Control 3.0 secara default sudah diikutsertakan pada paket instalasi Microsoft Embedded Visual Basic 3.0. 3. Ubah properti Project1 seperti pada tabel dibawah ini :

Project Name MenuBar

Remote Path \Windows\Start Menu\ Project1.vb Run On Target Pocket PC 2002 Emulation

(12)

Name frmUtama

Caption Contoh MenuBar

5. Tambahkan kontrol MenuBar pada frmUtama dengan memilih icon pada ToolBox. Ubah properti seperti pada tabel dibawah ini :

Name MenuBar

Enabled True

NewButton False

6. Tambahkan kode program dibawah ini dengan cara klik dua kali pada frmUtama.

Private Sub Form_Load() Dim mnuFile As MenuBarMenu Dim mnuEdit As MenuBarMenu

Set mnuFile = MenuBar.Controls.AddMenu("File", "mnuFile") mnuFile.Items.Add 1, "mnuFileNew", "New"

(13)

mnuFile.Items.Add 3, "mnuFileSave", "Save" mnuFile.Items.Add 4, , , mbrMenuSeparator mnuFile.Items.Add 5, "mnuFileExit", "Exit"

Set mnuEdit = MenuBar.Controls.AddMenu("Edit", "mnuEdit") mnuEdit.Items.Add 1, "mnuEditCopy", "Edit"

mnuEdit.Items.Add 2, "mnuEditPaste", "Paste" Set mnuFile = Nothing

Set mnuEdit = Nothing End Sub

Untuk memberikan reaksi atas menu-menu yang dipilih, maka tambahkanlah kode program dibawah ini.

Private Sub MenuBar_MenuClick(ByVal Item As MenuBarLib.Item) Select Case Item.Key

Case "mnuFileNew": MsgBox "menu File > New dipilih" Case "mnuFileOpen": MsgBox "menu File > Open dipilih" Case "mnuFileSave": MsgBox "menu File > Save dipilih" Case "mnuFileExit": App.End

Case "mnuEditCopy": MsgBox "menu Edit > Copy dipilih" Case "mnuEditPaste": MsgBox "menu Edit > Paste dipilih" End Select

End Sub

(14)