Tutorial Cara Membuat Sidebar Menu di Delphi 7 Sederhana Keren Menarik – Pernahkan pembaca melihat menu navigasi yang terletak disebelah kanan atau kiri dari form aplikasi? Jika belum mari buka Smartphone Android pembaca kemudian buka aplikasi misalnya BBM atau telegram. Kalaupun tidak punya keduanya mungkin pembaca dapat membuka aplikasi Google Mail (Gmail) yang pastinya sudah terinstall secara default di smartphone Android.
Pada bagian pojok kiri atas, terdapat icon (gambar) yang mana icon ini memiliki arti Open Menu Navigation. Nah, saat terbuka akan tampak begitu banyak menu yang tersaji disana. Saat diklik, menu tersebut akan membuka form lain yang tentunya sesuai dengan nama pada button menu tersebut. Maka dari itu, model menu inilah yang penulis sebut dengan nama “Sidebar Menu”.
 |
| Tutorial Cara Membuat Sidebar Menu di Delphi 7 Sederhana Keren Menarik |
- Buka aplikasi Borland Delphi 7.
- Buat sebuah project dengan nama “prjsidebar_menu”.
- Tambahkan sebuah form dengan nama “frmsidebar_menu”.
- Atur form frmsidebar dengan detail sebagai berikut.
Properties
|
Value
|
Caption
|
Sidebar Menu
|
Color
|
clBtnFace
|
+ Font
Color
Name
Size
|
clWindowText
Trebuchet MS
13
|
Height
|
476
|
Name
|
frmsidebar_menu
|
Width
|
928
|
- Jika sudah dibuat, kemudian tambahkan sebuah Panel yang kemudian diletakkan ke posisi paling kiri pada form. Berikut ini detail pengaturannya.
Properties
|
Value
|
BevelOuter
|
bvNone
|
Caption
|
|
Color
|
clWhite
|
Height
|
437
|
Left
|
0
|
ParentFont
|
False
|
Top
|
0
|
Name
|
pnlmenu
|
Width
|
217
|
Maka akan tampil seperti gambar dibawah ini.
 |
| Peletakan Panel pnlmenu |
- Tambahkan 6 buah label dengan beberapa pengaturan properties yang sama. 6 buah label ini disimpan kedalam Panel pnlmenu, jangan diluarnya. Adapun nilai yang dapat di set adalah sebagai berikut.
Pengaturan Semua Label
Properties
|
Value
|
Autosize
|
False
|
Color
|
cl3DLight
|
Cursor
|
crHandPoint
|
Height
|
52
|
Layout
|
tlCenter
|
Left
|
-1
|
ParentColor
|
False
|
ParentFont
|
False
|
Transparant
|
True
|
Width
|
217
|
Pengaturan Label 1
Properties
|
Value
|
Caption
|
Beranda
|
Name
|
btnberanda
|
Top
|
8
|
Pengaturan Label 2
Properties
|
Value
|
Caption
|
Simpan
Halaman
|
Name
|
btnsimpan_halaman
|
Top
|
64
|
Pengaturan Label 3
Properties
|
Value
|
Caption
|
Halaman
Koran
|
Name
|
btnhalaman_koran
|
Top
|
120
|
Pengaturan Label 4
Properties
|
Value
|
Caption
|
Edisi
Khusus
|
Name
|
btnedisi_khusus
|
Top
|
176
|
Pengaturan Label 5
Properties
|
Value
|
Caption
|
Pengguna
|
Name
|
btnpengguna
|
Top
|
237
|
Pengaturan Label 6
Properties
|
Value
|
Caption
|
Pengaturan
|
Name
|
btnpengaturan
|
Top
|
293
|
Catatan : Tambahkan dua spasi didepan Caption agar tulisan tidak tampak menempel pada bingkai form.
- Tambahkan lagi Label didalam Panel pnlmenu yang fungsinya sebagai garis batas sisi kanan.
Properties
|
Value
|
Align
|
alRight
|
Autosize
|
False
|
Color
|
clMoneyGreen
|
Height
|
437
|
Left
|
216
|
ParentColor
|
False
|
Top
|
0
|
Width
|
1
|
- Setelah itu tambahkan lagi label untuk pembatas antar menu yang berbeda jenisnya.
Properties
|
Value
|
Autosize
|
False
|
Color
|
clMoneyGreen
|
Height
|
1
|
Left
|
0
|
ParentColor
|
False
|
ParentFont
|
False
|
Top
|
232
|
Width
|
217
|
- Terakhir tambahkan lagi sebuah Label yang digunakan untuk signature application.
Properties
|
Value
|
Align
|
alCustom
|
Alignment
|
taCenter
|
Autosize
|
False
|
Caption
|
Copyright © 2017 | Rangga Saputra Teknoborneo.com
|
Color
|
cl3Dlight
|
+ Font
Color
Name
Size
|
clGray
Trebuchet MS
8
|
Height
|
35
|
Left
|
0
|
ParentColor
|
False
|
ParentFont
|
False
|
Top
|
390
|
Transparent
|
True
|
Width
|
217
|
WordWrap
|
True
|
Jika langkah-langkah diatas telah diselesaikan, maka tampilan Sidebar Menu Navigation akan tampak seperti gambar dibawah ini.
 |
| Sidebar Menu yang telah selesai dibuat |
Pembaca bisa mendapatkan project ini pada blog Tekno Borneo ini.
<< Kembali : Ke artikel yang lebih lengkap
Follow blog ini jika ingin mendapatkan informasi seputar dunia teknologi. Tetap Ikhtiar, Tawakal dan Berdoa agar #KamekJadiHero.
My Contact :
Facebook : Rangga Saputra
Fanspage : Teknoborneocom
Instagram : @teknoborneo
HP/WA/Telegram : +628 988282 108
My Contact :
Facebook : Rangga Saputra
Fanspage : Teknoborneocom
Instagram : @teknoborneo
HP/WA/Telegram : +628 988282 108
Tutorial Cara Membuat Sidebar Menu di Delphi 7 Sederhana Keren Menarik
4/
5
Oleh
Rangga Saputra
4 komentar
Tulis komentarLanjutannya mana gan belum kelar itu kayaknya
ReplyUdh kelar tuh gan...
ReplyBelum selesai kyxny a yg di download itu bg
Replyad sofware delphi untuk windows 10 mas
ReplySilahkan Tinggalkan Kritik dan Saran yang membangun dari Anda
1. Berkomentarlah yang baik dan sopan
2. Untuk menyisipkan kode pendek, gunakan <i rel="code"> ... KODE ... </i>
3. Untuk menyisipkan kode panjang, gunakan <i rel="pre"> ... KODE ... </i>
4. Untuk menyisipkan gambar, gunakan <i rel="image"> ... URL GAMBAR ... </i>