DESAIN MENU

Menu Bar
Menu adalah kumpulan baris perintah untuk melakukan suatu tugas tertentu. Pada sebuah program aplikasi, menu dikumpulkan dan ditampilkan pada sebuah batang yang disebut menu bar. Sebuah program aplikasi yang baik, harus memiliki menu bar agar seorang user dapat memanfaatkan semua kemampuan yang dimiliki program aplikasi.

Gambar 8.1. Dialog Menu Editor. Pada Visual Basic, untuk membuat sebuah menu bar digunakan fasilitas Menu Editor. Untuk memamanggil pada tooolbar, atau tekan tombol Menu Editor, klik menu Tools Menu Editor, atau klik tobol Ctrl+E pada keyboard. Untuk mengawali membuat sebuah menu, ketikkan teks pada text box Caption, contoh: &File. Tanda & digunakan untuk menentukan shortcut menu (melalui penekanan tombol Alt pada keyboard). Huruf setelah tanda & akan dibubuhi garis bawah. Kemudian ketikkan nama untuk menu tersebut pada text box Name, contoh: mnuFile. Klik tombol Next untuk membuat menu berikutnya. Ketikkan: &New pada text box Caption dan ketikkan: mnuFileNew pada text box Name. Klik tombol bergambar anak panah ke kanan ( ). Langkah ini berfungsi untuk mengubah menu menjadi sub menu (pada ListView akan tertulis --&New). Pilih Ctrl+N pada combobox Shortcut. Klik tombol OK untuk menutup dialog Menu Editor. Pada sisi kiri atas form (di bawah title bar) sudah tercetak sebuah menu bar dengan teks: File. Klik menu File, di dalam menu File akan terdapat sub menu New.

Gambar 8.2. Form dengan menu File. Tampilkan kembali Menu Editor, klik tombol Next dua kali untuk menambahkan sebuah sub menu baru. Ketikkan tanda separator - pada textbox Caption. Ketikkan: spr11 pada TextBox Name. Klik tombol OK. Sekarang, klik menu File pada form. Di bawah menu New akan tercetak sparator/pembatas menu.

Tampilkan kembali Menu Editor, klik tombol Next tiga kali untuk menambahkan sebuah sub menu baru. Klik tombol bergambar anak panah ke kiri ( ), untuk mengubah sub menu menjadi menu utama. Ketikkan: &Edit pada textbox Caption dan ketikkan: mnuEdit pada textbox Name. Klik tombol Next, klik tombol bergambar anak panah ke kanan ( ). Ketikkan: &Tampil pada textbox Caption dan ketikkan: mnuEditTampil pada text box Name. Tandai checkbox Checked. Klik tombol OK. Pada form sudah terdapat menu utama baru dengan nama Edit. Klik menu Edit tersebut, akan terdapat sebuah sub menu Tampilan yang dilengkapi tanda check di sisi kirinya.

Gambar 8.3. Form dengan menu File dan Edit. Tampilkan kembali Menu Editor, buat sebuah menu baru dengan Caption: &Windows dan dengan Name: mnuWindows, tandai check box WindowList. WindowList hanya dapat digunakan pada sebuah menu utama dan biasanya digunakan pada aplikasi multiple interface (menggunakan MDIForm). WindowsList adalah fasilitas untuk menampilkan form-form anak (yang sedang ditampilkan pada sebuah MDIForm) melalui sub-sub menu.

Menu Pop-Up
Menu Pop-Up adalah menu yang ditampilkan pada saat Anda mengklik tombol kanan mouse. Untuk membuat menu Pop-Up sama seperti membuat MenuBar, hanya saja diperlukan rutin kode untuk memanggil menu tersebut. Menu yang dijadikan Pop-Up adalah menu utama. Rutin pemanggilan ditempatkan pada Prosedur event MouseUp atau MouseDown dari form atau dari sebuah objek. Rutin pemanggilan: Private Sub Form_MouseDown(Button As Integer, _ Shift As Integer, X As Single, Y As Single) [If Button = {2 | vbRightButton} Then] Me.PopupMenu namaMenuUtama [, Flags] _ [, X][, Y] [,DefaultMenu] [End If] End Sub Argumen NamaMenuUtama Flag X Y DefaulMenu Flag Const vbPopupMenuCenterAlign vbPopupMenuLeftAlign Keterangan Nilai properti Name dari menu utama Jenis tampilan menu Pop-Up Posisi atas menu Pop-Up terhadap form Posisi kiri menu Pop-Up terhadap form Item menu yang di-default-kan (dicetak tebal) Nilai 4 0 Keterangan Menu Pop-Up ditampilkan dari tengah-tengah posisi Horisontal pointer Menu Pop-Up ditampilkan dari sisi kiri Horisontal pointer

vbPopupMenuLeftButton vbPopupMenuRightAlign vbPopupMenuRightButton

0 8 2

Menu Pop-Up hanya dapat ditutup setelah mengklik tombol kiri mouse Menu Pop-Up ditampilkan dari sisi kanan Horisontal pointer Menu Pop-Up dapat ditutup dengan mengklik tombol kiri maupun kanan mouse

Contoh pemanggilan: Private Sub Form_MouseDown(Button As Integer, _ Shift As Integer, X As Single, Y As Single) If Button = 2 Then Me.PopupMenu mnuFile, 2 Or 4, , , mnuFileNew End If End Sub Ketika Anda mengklik tombol kanan mouse, popup menu akan ditampilkan dari posisi tengah horisontal pointer, dan menu New akan dicetak tebal.

Menambahkan Gambar pada Sub Menu

Mungkin Anda yang sudah biasa mendesain menu bar dalam pembuatan program aplikasi dengan Visual Basic merasa bosan dengan tampilan menu tersebut. Karena jika Anda melihat program aplikasi besar sekelas Ms. Word, Ms. Excel bahkan Ms. Visual Basic sendiri, sebagian sub menunya dilengkapi gambar pada sisi kirinya.

Gambar 8.4. Tampilan form dengan sub menu bergambar. Visual Basic memang tidak melengkapi fasilitas untuk itu. Namun sebenarnya Anda dapat melakukannya. Bagaimana caranya? Anda memerlukan Fungsi API untuk tujuan tersebut.

Contoh Program 7
Contoh program di bawah akan menerangkan bagaimana cara Anda menambahkan gambar pada menu.

a. Desain Form
Buatlah folder baru di alamat: C:\Menggali VB\Bab 8 dengan nama Program 7. Jalankan Visual Basic pada template Standar Exe. Tambahkan sebuah Module pada Project Anda. Simpan semua komponen project Anda. Gambarkan sebuah objek Image pada Form1, ubah Name menjadi imgMenu. Ubah properti Picture dengan gambar dari: C:\Program Files\Microsoft Visual Studio\Comon\Graphic\Bitmaps\TlBr_W95\New. Gandakan imgMenu menjadi 6 (enam) buah. Ubah properti Picture dari masing-masing imgMenu dengan gambar dari alamat seperti pada langkah 3)

Gambar 8.5. Desain Form. Buat menu seperti pada tabel di bawah ini Caption &File &New &Open &Save &Edit &Copy Cu&t &Paste Name mnuFile mnuFileNew mnuFileOpen mnuFileSave mnuEdit mnuEditCopy mnuEditCut mnuEditPaste Indentasi 0 1 1 1 0 1 1 1

b. Baris Kode
Baris Kode Baris kode pada: Module1 1 Option Explicit ' 2 Declare Function GetMenu& _ Lib "user32" (ByVal tgWnd As Long) 3 Declare Function GetSubMenu& Lib "user32" _ (ByVal tgMenu As Long, ByVal Posisi As Long) Declare Function GetMenuItemID& Lib "user32" _ (ByVal tgMenu As Long, ByVal Posisi As Long) Declare Function SetMenuItemBitmaps& _ Lib "user32" (ByVal tgMenu As Long, _ ByVal Posisi As Long, ByVal Flags As Long, _ ByVal BitmapUncheck As Long, _ ByVal BitmapCheck As Long) Dim MenuUtama&, SubMenu&, xSubMenu& Sub TambahkanGambar(Frm As Form) With Frm MenuUtama = GetMenu(.hWnd) 'Menentukan sub utama pertama(menu File) SubMenu = GetSubMenu(MenuUtama, 0) 'Menentukan sub menu pertama (menu File New) xSubMenu = GetMenuItemID(SubMenu, 0) 'Menggambar sub menu pertama (menu File New) 'dengan mengambil gambar dari imgMenu Index 0 SetMenuItemBitmaps MenuUtama, _

6 7 8 9 10 11

12

13

14

15

16

17 18

19

20

21

22

23

24 25

xSubMenu, 1, !imgMenu(0).Picture, _ !imgMenu(0).Picture 'Menentukan sub menu pertama (menu File Open) xSubMenu = GetMenuItemID(SubMenu, 1) 'Menggambar sub menu kedua (menu File Open) 'dengan mengambil gambar dari imgMenu Index 1 SetMenuItemBitmaps MenuUtama, _ xSubMenu, 1, !imgMenu(1).Picture, _ !imgMenu(1).Picture 'Menentukan sub menu pertama (menu File Save) xSubMenu = GetMenuItemID(SubMenu, 2) 'Menggambar sub menu ketiga (menu File Save) 'dengan mengambil gambar dari imgMenu Index 2 SetMenuItemBitmaps MenuUtama, _ xSubMenu, 1, !imgMenu(2).Picture, _ !imgMenu(2).Picture 'Menentukan sub utama kedua(menu Edit) SubMenu = GetSubMenu(MenuUtama, 1) 'Menentukan sub menu pertama (menu Edit Copy) xSubMenu = GetMenuItemID(SubMenu, 0) 'Menggambar sub menu pertama (menu Edit Copy) 'dengan mengambil gambar dari imgMenu Index 3 SetMenuItemBitmaps MenuUtama, _ xSubMenu, 1, !imgMenu(3).Picture, _ !imgMenu(3).Picture 'Menentukan sub menu kedua (menu Edit Cut) xSubMenu = GetMenuItemID(SubMenu, 1) 'Menggambar sub menu kedua (menu Edit Cut) 'dengan mengambil gambar dari imgMenu Index 4 SetMenuItemBitmaps MenuUtama, _ xSubMenu, 1, !imgMenu(4).Picture, _ !imgMenu(4).Picture 'Menentukan sub menu ketiga (menu Edit Paste) xSubMenu = GetMenuItemID(SubMenu, 2) 'Menggambar sub menu ketiga (menu Edit Paste) 'dengan mengambil gambar dari imgMenu Index 5 SetMenuItemBitmaps MenuUtama, _ xSubMenu, 1, !imgMenu(5).Picture, _ !imgMenu(5).Picture End With End Sub

Baris kode pada: Form1 1 Option Explicit ' 2 Private Sub Form_Load() 3 TambahkanGambar Me 4 End Sub 5 Private Sub Form_MouseDown(Button As Integer, _ Shift As Integer, X As Single, Y As Single) 'Jika mengklik tombol kanan mouse If Button = 2 Then PopupMenu mnuEdit, 2 or 4, , , mnuEditCut End If End Sub

6 7 8 9

10 11 12

Private Sub mnuEditCut_Click() MsgBox "Silakan masukkan kode Anda di sini" End Sub

c. Tes Program
Jalankan program! Klik sebuah menu utama Pada sub menu kini sudah tercetak gambar. Catatan: Picture dari objek Image pada contoh program di atas haruslah file gambar (jpg atau bmp) dengan ukuran 13x12 pixels. Menggunakan file gambar yang melebihi ukuran tersebut, atau mengambil gambar dari file icon (ico), penggambaran menu tidak akan berhasil.