Bottom Navigation Menggunakan Fragment di Android Studio
Cara Membuat dan Menggunakan Fragment di Android Studio - Fragment adalah bagian dari User Interface UI didalam Android, Beberapa fragment dapat digabungkan dalam satu activity sehingga tercipta tampilan multi-panel.
Pada tutorial sebelumnya kita belajar Pengertian, Fungsi Intent di Android Studio, apakah kalian sudah memahami apa itu Intent, fungsi inten dan jenis intent explicit dan intent implicit?
Admin harap kalian mudah memehaminya dan berhasil mencoba membuat contoh intent didalam aplikasi android sederhana.
Nah pada kesempatan ini kita akan belajar mengenai Fragment di Android Studio.
Fragment adalah bagian dari User Interface dari sebuah Activity yang memiliki lifecycle sendiri.
Konsep fragment itu sendiri ketika sebuah fragment dapat berjalan saat sebuah activity memanggilnya, sehingga fragment semacam sub-activity yang tersusun dari beberapa fragment didalam satu activity.
Bentuk fragment itu sendiri hampir mirip dengan Activity yang memiliki class untuk struktur kode logika dan layout tampilan XML, hanya saja turunan class extendsnya saja yang berbeda.
Perbedaan activiti dan fragment adalah jika Fragment akan menginduk extends (inherit) ke Fragment dan Activity akan extends ke MainActivitynya.
Fragment pertama kali diperkenalkan Google pada versi API 10 (Gingerbread) untuk menangani User Interface yang dinamis dan variatif pada satu layout.
Salah satu alasan mengapa aplikasi yang akan kalian kembangkan harus menggunakan Fragment yakni, kalian dapat membuat banyak layout tampilan tanpa harus berpindah activity.
Kok bisa seperti itu? jawabanya yakni dari kegunaan Fragment itu sendiri yang memiliki sifat Modular dan Reusable.
Artinya dalam satu activity dapat memiliki lebih dari satu fragment dan satu fragment dapat memuat banyak activity sekaligus. Untuk lebih memahami Fragment perhatikan daftar berikut:
Secara alur kerja dari sebuah Fragment didalam Android Studio dapat di representasikan pada gambar berikut:
Fragment sendiri memiliki daur hidup sendiri layaknya sebuah Activity namun daur hidup Fragment sangat bergantung pada daur hidup sebuah Activity.
Didalam lifecycle fragment terdiri dari beberapa state yakni Resumed, Paused dan Stopped.
Resumed artinya pengguna dapat melihat fragment ketika activity sedang berjalan.
Paused artinya ketika activity lain yang menutupi sebagian dari activity yang memuat fragment sehingga masih dapat terlihat didalam layar meskipun hanya sebagian.
Stopped artinya ketika sebuah fragment sepenuhnya tidak terlihat dilayar, hal ini bisa terjadi ketika activity yang ditempati fragment sudah dihapus dari activity sehingga tidak muncul sama sekali di layar.
Perhatikan gambar berikut untuk memahami daur hidup dari sebuah Fragment yang menunjukkan Callback Method ketika terjadi perubahan pada Activity.
Penjelasan dari gambar diatas yakni ketika ada perubahan pada Activity maka akan mempengaruhi lifecycle dari Fragment.
Sebagai contoh kali ini kita akan membuat navigasi yang populer di aplikasi Android yakni BottomNavigation dengan menggunakan fragment sebagai container halamannya.
Buat Project Baru
Pilih Empty Project untuk memulai membuat BottomNavigation.
Tambahkan depedencies berikut dan lakukan sync, untuk cara menambahkan depedencies buka gradle.build lalu masukkan "implementation 'com.android.support:design:27.0.2'" karena contoh project ini akan dibuat menggunakan SDK versi 27.
Persiapan Resource
Lahkah selanjutnya pada folder res > value > buat file baru yakni string.xml dan color.xml untuk source code dari masing-masing xml sebagai berikut:
color.xml
string.xml
Untuk pengaturan dari icon yang akan ditampilkan pada BottomNavigation perhatikan cara berikut:
Klik kanan folder res > New > Vector Asset, lalu pilih icon dengan nama home, search, favorite, account.
Beri masing-masing icon dengan nama ic_home, ic_search, ic_favorite, ic_account.
Tahap selanjutnya yakni kita akan menambahkan 4 item menu ini sebagai BottomNavigation dengan cara berikut:
Klik kanan pada folder res > New > Android Resource File.
Buat nama file bottomnavigation_menu.xml dan ubah resource type nya menjadi Menu.
Pada file bottomnavigation_menu.xml ini kita akan mengetikan kode xml sebagai tampilan.
bottomnavigation_menu.xml
Pada bagian layout ini kita akan menambahkan BottomNavigationView dan Frame Layout sebagai container dari fragment di layout main_activity.xml
main_activity.xml
Karena kita akan memakai 4 fragment sekaligus dalam satu activity maka kita akan membuat 4 layout dari masing-masing fragment.
Buat 4 file fragment dengan nama fragment_home.xml, fragment_search.xml, fragment_favorite.xml, fragment_account.xml.
fragment_home.xml
fragment_search.xml
fragment_favorite.xml
fragment_account.xml
Buat 4 class Fragment dengan masing-masing nama fragment HomeFragment, SearchFragment, FavoriteFragment, AccountFragment dengan cara New > Fragment > Blank Fragment.
Berikut ini source code dari masing-masing fragment.
HomeFragment
SearchFragment
FavoriteFragment
AccountFragment
MainActivity.java
Kesimpulan
Fragment adalah bagian dari User Interface dari sebuah Activity yang memiliki lifecycle sendiri.
Artinya dalam satu activity dapat memiliki lebih dari satu fragment dan satu fragment dapat memuat banyak activity sekaligus. Untuk lebih memahami Fragment perhatikan daftar berikut:
Begitulah tadi pembahasan soal pengertian fragment, fungsi dari fragment dan contoh pembuatan Bottom Navigation Menggunakan Fragment di Android Studio semoga tutorial ini bermanfaat untuk kalian yang sudah membacanya.
Lebih lengkap mengenai Fragment dapat dilihat di dokumentasi google Fragment
Untuk pembahasan selanjutnya kita akan belajar Membuat ListView Click di Android Studio
Pada tutorial sebelumnya kita belajar Pengertian, Fungsi Intent di Android Studio, apakah kalian sudah memahami apa itu Intent, fungsi inten dan jenis intent explicit dan intent implicit?
Admin harap kalian mudah memehaminya dan berhasil mencoba membuat contoh intent didalam aplikasi android sederhana.
Nah pada kesempatan ini kita akan belajar mengenai Fragment di Android Studio.
Bottom Navigation Menggunakan Fragment di Android Studio |
Apa itu Fragment di Android Studio?
Fragment adalah bagian dari User Interface dari sebuah Activity yang memiliki lifecycle sendiri.
Konsep fragment itu sendiri ketika sebuah fragment dapat berjalan saat sebuah activity memanggilnya, sehingga fragment semacam sub-activity yang tersusun dari beberapa fragment didalam satu activity.
Bentuk fragment itu sendiri hampir mirip dengan Activity yang memiliki class untuk struktur kode logika dan layout tampilan XML, hanya saja turunan class extendsnya saja yang berbeda.
Perbedaan activiti dan fragment adalah jika Fragment akan menginduk extends (inherit) ke Fragment dan Activity akan extends ke MainActivitynya.
Fragment pertama kali diperkenalkan Google pada versi API 10 (Gingerbread) untuk menangani User Interface yang dinamis dan variatif pada satu layout.
Alasan Pentingnya Menggunakan Fragment
Salah satu alasan mengapa aplikasi yang akan kalian kembangkan harus menggunakan Fragment yakni, kalian dapat membuat banyak layout tampilan tanpa harus berpindah activity.
Kok bisa seperti itu? jawabanya yakni dari kegunaan Fragment itu sendiri yang memiliki sifat Modular dan Reusable.
Artinya dalam satu activity dapat memiliki lebih dari satu fragment dan satu fragment dapat memuat banyak activity sekaligus. Untuk lebih memahami Fragment perhatikan daftar berikut:
- Sebuah Fragment merupakan gabungan dari layout XML dan Class Java yang mirip dengan sebuah Activity.
- Dengan dukungan support library kita dapat menggunakan Fragment pada versi androi yang berbeda-beda.
- Dalam satu Activity kita dapat memuat banyak Fragment sekaligus.
- Dalam satu Fragment terdiri dari View, Event dan Logic.
Secara alur kerja dari sebuah Fragment didalam Android Studio dapat di representasikan pada gambar berikut:
Fragment |
Memahami Fragment Lifecycle di Android Studio
Fragment sendiri memiliki daur hidup sendiri layaknya sebuah Activity namun daur hidup Fragment sangat bergantung pada daur hidup sebuah Activity.
Didalam lifecycle fragment terdiri dari beberapa state yakni Resumed, Paused dan Stopped.
Resumed artinya pengguna dapat melihat fragment ketika activity sedang berjalan.
Paused artinya ketika activity lain yang menutupi sebagian dari activity yang memuat fragment sehingga masih dapat terlihat didalam layar meskipun hanya sebagian.
Stopped artinya ketika sebuah fragment sepenuhnya tidak terlihat dilayar, hal ini bisa terjadi ketika activity yang ditempati fragment sudah dihapus dari activity sehingga tidak muncul sama sekali di layar.
Perhatikan gambar berikut untuk memahami daur hidup dari sebuah Fragment yang menunjukkan Callback Method ketika terjadi perubahan pada Activity.
Fragment Lifecycle |
Penjelasan dari gambar diatas yakni ketika ada perubahan pada Activity maka akan mempengaruhi lifecycle dari Fragment.
Cara Membuat Bottom Navigation Fragment di Android Studio
Sebagai contoh kali ini kita akan membuat navigasi yang populer di aplikasi Android yakni BottomNavigation dengan menggunakan fragment sebagai container halamannya.
Buat Project Baru
Pilih Empty Project untuk memulai membuat BottomNavigation.
Tambahkan depedencies berikut dan lakukan sync, untuk cara menambahkan depedencies buka gradle.build lalu masukkan "implementation 'com.android.support:design:27.0.2'" karena contoh project ini akan dibuat menggunakan SDK versi 27.
Persiapan Resource
Lahkah selanjutnya pada folder res > value > buat file baru yakni string.xml dan color.xml untuk source code dari masing-masing xml sebagai berikut:
color.xml
string.xml
Drawable
Untuk pengaturan dari icon yang akan ditampilkan pada BottomNavigation perhatikan cara berikut:
Klik kanan folder res > New > Vector Asset, lalu pilih icon dengan nama home, search, favorite, account.
Beri masing-masing icon dengan nama ic_home, ic_search, ic_favorite, ic_account.
Menu
Tahap selanjutnya yakni kita akan menambahkan 4 item menu ini sebagai BottomNavigation dengan cara berikut:
Klik kanan pada folder res > New > Android Resource File.
Buat nama file bottomnavigation_menu.xml dan ubah resource type nya menjadi Menu.
Pada file bottomnavigation_menu.xml ini kita akan mengetikan kode xml sebagai tampilan.
bottomnavigation_menu.xml
Layout
Pada bagian layout ini kita akan menambahkan BottomNavigationView dan Frame Layout sebagai container dari fragment di layout main_activity.xml
main_activity.xml
Karena kita akan memakai 4 fragment sekaligus dalam satu activity maka kita akan membuat 4 layout dari masing-masing fragment.
Buat 4 file fragment dengan nama fragment_home.xml, fragment_search.xml, fragment_favorite.xml, fragment_account.xml.
fragment_home.xml
fragment_search.xml
fragment_favorite.xml
fragment_account.xml
Memulai Fragment Logic
Buat 4 class Fragment dengan masing-masing nama fragment HomeFragment, SearchFragment, FavoriteFragment, AccountFragment dengan cara New > Fragment > Blank Fragment.
Berikut ini source code dari masing-masing fragment.
HomeFragment
SearchFragment
FavoriteFragment
AccountFragment
Load Fragment pada MainActivity.java
Pada bagian ini kita akan memanggil fragment yang sudah kita buat kedalam MainActivity.javaMainActivity.java
Kesimpulan
Fragment adalah bagian dari User Interface dari sebuah Activity yang memiliki lifecycle sendiri.
Artinya dalam satu activity dapat memiliki lebih dari satu fragment dan satu fragment dapat memuat banyak activity sekaligus. Untuk lebih memahami Fragment perhatikan daftar berikut:
- Sebuah Fragment merupakan gabungan dari layout XML dan Class Java yang mirip dengan sebuah Activity.
- Dengan dukungan support library kita dapat menggunakan Fragment pada versi androi yang berbeda-beda.
- Dalam satu Activity kita dapat memuat banyak Fragment sekaligus.
- Dalam satu Fragment terdiri dari View, Event dan Logic.
Begitulah tadi pembahasan soal pengertian fragment, fungsi dari fragment dan contoh pembuatan Bottom Navigation Menggunakan Fragment di Android Studio semoga tutorial ini bermanfaat untuk kalian yang sudah membacanya.
Lebih lengkap mengenai Fragment dapat dilihat di dokumentasi google Fragment
Untuk pembahasan selanjutnya kita akan belajar Membuat ListView Click di Android Studio
Posting Komentar