Tutorial membuat Bottom Navigation View di android studio

Halo semuanya, pada postingan ini saya akan membagikan tutorial sederhana untuk kalian yang baru belajar membuat aplikasi android menggunakan android studio.

Pada tutorial kali ini kita akan belajar membuat Bottom Navigation View di android studio.

Daftar Isi sembunyikan

1. Project Bottom Navigation

2. Update colors.xml

3. Membuat selector

4. Membuat menu bottom navigation

5. Desain user interface

6. Handle bottom navigation

7. Kode lengkap MainActivity.kt

Project Bottom Navigation

Hal pertama yang harus kita lakukan tentu membuat project baru di android studio. Pada tutorial ini saya memberikan nama projeknya “Bottom Navigation”.

Update colors.xml

Buka file colors.xml kemudian tambahkan beberapa warna yang akan digunakan bottom navigation. Kita bisa memberi warna apapun, namun pada tutorial ini saya memberikan warna putih untuk background, warna abu-abu untuk navigasi yang tidak terpilih, dan warna ungu untuk navigasi terpilih.

Membuat selector

Buat file selector pada directory res>drawable dengan nama color_state. File ini digunakan untuk menghandle perubahan warna pada bottom navigation ketika di klik.

Membuat menu bottom navigation

Buat directory baru pada directory “res” dengan nama “menu”. Tambahkan beberapa asset yang dibutuhkan untuk icon setiap navigasi pada directory res>drawable. Kemudian buat file menu seperti dibawah ini.

Desain user interface

Buka activity_main.xml, kemudian ubah kodenya seperti berikut.

Handle bottom navigation

Tambahkan listener untuk menghandle ketika navigasi di pilih. Disini kita berikan action untuk merubah textview sesuai title pada bottom navigation view.