Monday, March 4, 2019

Modifikasi Navigation Drawer Menu Dengan Menambah, Menghapus, dan Mengganti Nama Menu dan Icon Menu Dengan Vector Assest di Android Studio

Setelah sebelumnya sudah mempelajari membuat menu drawer dan option menu di android studio maka kali ini akan kita bahas bagaiman menambah menu pada drawer menu, kemudian merubah menu default dari drawer menu dan mengurangi menu yang ada pada drawer menu di android studio.

Oia, sekiranya pada saat membuat new project pilih drawer activity supaya tinggal mudah mengikuti untuk memodifikasi menu-menu untuk drawer menu. Jika belum memahami membuat drawer activity, silahkan baca artikel tentang membuat menu drawer di android studio.


Dengan menambahkan atau merubah pilihan pada drawer di aplikasi android yang kita buat akan memaksimalkan fungsi dan kinerja dari aplikasi yang akan kita buat nantinya.

cara mengganti icon dan nama menu di navigation drawer pada android studio
Gambar Merubah Menu-Menu Drawer Navigation di Android Studio

Gambar diatas adalah tujuan kita, bagaiman menu-menu default dari drawer menu tersebut kita ganti sesuai keinginan kita dan menambah icon dari menu tersebut. Nantinya nama menu bisa anda tentukan sesuka anda, disini saya hanya memandu dalam memodifikasi dari drawer menu default.

Pertama, kita masuk kefolder Res, Menu, dan buka Activity_main_drawer seperti terlihat pada gambar berikut ini

merubah menu-menu pada navigation drawer di android studio
Gambar Main Drawer

Buka file yang ditandai tersebut sampai tampil pada editor sebelah kanan, dan disinilah kita dapat menambah menu, merubah menu, dan menghapus menu yang ada di drawer di android studio.

Kemudian untuk awal ini, copy 1 itemnya dan pastekan dimana menu yang akan anda tambah, apakah diawal, ditengah atau diakhir. Sebagai contoh saya copy item camera/import dan saya pastekan di paling atas, kemudian saya rubah id menjadi nav_anakit beserta dengan titlenya. Perhatikan gambar dibawah ini 

menambah menu di Drawer pada android studio serta mengurangi menu pada drawer menu pada android studio
Menambah Menu di Navigation Drawer pada android studio

Terlihat pada item yang pertama adalah hasil copyan dari item kedua (camera) sehingga pada icon masih sama yaitu ic_menu_camera. Dan jelas terlihat sama dengan yang dibawahnya dan iconnya juga sama bisa dilihat seperti yang ditandai lingkaran biru.

Nah, icon ini kita rubah di drawable, jika anda ingin punya icon sendiri yang akan anda jadikan untuk menempati seperti lingkaran biru tersebut, anda hanya perlu mengimporkan ke drawable.


Tapi jika tidak, kita menambahkan icon dari vector asset saja. Caranya klik kanan pada folder drawable, pilih new, dan pilih vector asset. Perhatikan gambar berikut ini

cara Menambah Icon Untuk Menu pada Navigation Drawer di android studio
Gambar Menambah Icon Untuk Menu pada Navigation Drawer

Sehingga akan tampil seperti gambar berikut ini

mengganti icon di drawer menu pada android studio
Gambar Mengganti Icon Menu Drawer Navigation Di Android Studio

Jika anda ingin iconnya dari komputer anda, pilih yang dilingkari biru, namun disini kita ingin menggunakan icon-icon menu yang sudah ada dan kita tinggal pilih saja dengan klik yang dilingkari merah tersebut.

Cara Mengganti Icon Navigation Drawer di Android Studio
Gambar Memilih Icon Untuk Drawer Menu Di Android Studio

Perhatikan kategori icon anda, dan pilih icon untuk menu drawer yang baru anda tambahkan. Sebagai contoh saya ingin menambahkan icon folder untuk menu drawer File Anakit. Klik ok

Mengganti Warna Icon Navigation Drawer pada Android Studio
Gambar Mengganti Warna Icon Navigation Drawer pada Android Studio

Nah perlu diperhatikan fungsi-fungsi diatas dalam pembuatan icon dari menu drawer. Yang dilingkari merah adalah nama icon untuk di drawable. Nama icon ini yang akan dipanggil nantinya.

Jika anda ingin merubah ukuran icon dari menu, aktifkan override seperti lingkaran biru. Ubah angkanya.

Jika anda ingin merubah warna iconnya, anda tinggal memilih warnanya dari yang dilingkari kuning.

Dan pada lingkaran hitam untuk mengatur transparansi dari icon menu drawer tersebut. Jika sudah selesai, klik next.dan dilanjutkan dengan klik finish

Dan pada drawable akan satu xml yang telah kita buat tadi, perhatikan gambar berikut ini

Mengganti Warna Icon Navigation Drawer pada Android Studio
Gambar Icon Baru Untuk Navigation Drawer Menu Anakit

Kemudian pada activity_main_drawer kita tinggal merubah nama dari iconnya seperti terlihat pada gambar berikut ini

menganti icon menu pada navigation drawer pada android studio
Gambar Mengganti Nama untuk Icon Yang Digunakan

Kemudian jika anda ingin menghapus menu dari drawer lainnya, tinggal pilih item yang anda inginkan, kemudian hapus saja. Atau jika anda ingin merubah nama dari menu tersebut, anda tinggal merubah Titlenya, dan jangan lupa pada bagian id juga sesuaikan agar tidak bingung. Dan jika ingin merubah icon yang anda rubah tadi ya tinggal hapus saja icon yang tidak terpakai dari drawable dan kemudian tambahkan icon yang anda inginkan melalui cara-cara yang sudah diejalaskan diatas dan tinggal sesuaikan saja.

Demikianlah pembahasan tentang menambah menu di drawer dan merubah icon merubah nama merubah urutan menu di drawer menu.




EmoticonEmoticon