Membuat Menu Seperti Office 2010 Pada Delphi 2010

By: QMPC Network on 06.09

Tampilan Office 2010 memang memukau dan sangat menggoda. Dengan menu ribbonnya, Ia mampu menyedot perhatian penulis sehingga terbesit niat di hati untuk membuat aplikasi dengan menu Office 2010 tersebut. walaupun sudah pernah penulis buatkan video tutorialnya disini.

Ok, kita fokus ke pembahasan dulu. Kali ini penulis mau sharing tentang cara membuat menu seperti tampilan Office 2010. Namanya adalah menu Ribbon.

Biar gak buang-buang waktu karena penulis banyak kerjaan jadi langsung aja.

Langkah 1 :
Copy dulu software atau komponen yang terdapat pada buku penulis yang berjudul "Delphi dan Firebird Membuat Aplikasi Minimarket Client-Server: Support Barcode Scanner". dalam Hal ini adalah DevExpress khusus Delphi 2010.

Langkah 2 :
Install komponen yang tadi sudah dicopy. penulis anggap sudah beres karena sudah dijelaskan penulis dibuku dan di video tutorial.

Langkah 3 :
Buka Delphi, perhatikan pallete-nya. Jika seperti dibawah ini, berarti instalasi sudah sukses :

Langkah 4 : 

Pada Pallete ExpressBar, Tambahkan komponen dxBarManager dulu, setelah itu baru dxRibbon ke dalam form.

Langkah 5 : 

Double klik pada komponen dxBarManager lalu tambahkan Beberapa Toolbar. Hasilnya seperti berikut ini :

Langkah 6 : 

Untuk menambahkan tab pada ribbon, pembaca bisa klik kanan pada ribbon kemudian klik pada Tabs Editor, dan untuk mengedit nama dari tab bisa klik pada teb kemudian di object inspector pembaca bisa edit di coption, lalu akan muncul seperti berikut ini :

Langkah 7 :

Klik 1 kali tab menu. kemudian lihat pada object inspector -> dxRibbon -> dxRibbonTab1 -> Group -> Add Item

Langkah 8 :

Klik 1 kali item yang tadi ditambahkan pada group (tdxRibbonTabGroup). Perhatikan object inspector pembaca. ToolBar -> Pilih salah satu toolbar yang tadi dibuat dengan dxBarManager (Pada step 5 dan perhatikan gambar pada step 7)

Langkah 9 :
Ulangi langkah 6 sampai dengan 8 agar semua toolbar ditambahkan pada tdxRibbonTabGroup. Hasil Sementara Seperti dibawah ini :

Langkah 10 :

Klik kanan pada salah satu dari dua toolbar tersebut -> add large button. Ubah captionnya sesuai kebutuhan. Jika ingin menambahkan gambar pilih LargeGlyph. dan jika di run atau F9 hasilnya seperti berikut ini :

Langkah 11 :
Selamat mencoba :D