Menambahkan Fragment Secara Dinamis Pada ViewPager Android Berdasarkan Jumlah Item Pada List

Viewpager adalah sebuah view yang dapat menampung banyak fragment, namun masih dalam satu activity.

Jika kalian masih rada-rada bingung apa sih perbedaan fragment dan activity, kalian dapat membacanya dipostingan saya sebelumnya :

  1. Perbedaan Android Fragment dan Activity
  2. Belajar Menggunakan Android Fragment 
  3. Cara Pindah Activity menggunakan Intent

Kembali ketopik yaitu cara membahkan fragment pada viewpager secara dinamis sesuai dengan jumlah item pada list.

Maksudnya dinamis disini adalah :

Misalnya dalam sebuah list terdapat 10 item, maka nantinya jumlah fragment yang akan tampil di viewpager tersebut adalah 10

Jadi nanti, user tinggal geser-geser saja untuk melihat jumlah keseluruhan (tampilannya seperti sliding tab, tapi tidak ada tabnya)

Biar tidak bingung mari kita buat programnya satu persatu.

Hasil akhir

Oya sebelum masuk ke kodingan, dulu saya pernah membuat tutorial membuat tampilan dengan view pager namun fragmentnya dibuat static. Artinya jumlah fragment sudah ditentukan dari awal. Kalian bisa baca tutorialnya di : Membuat splash screen menggunakan viewpager dengan indicator.

File Drawable

Pada folder drawable, kita akan membuat file xml yang akan di gunakan sebagai pendanda indikator (titik-titik pada bagian bawah layar) yang sedang aktif.

Indicator viewpager

Buat file-file xml berikut ini dan tempatkan di directory res/drawable pada project yang kalian buat

selected_item.xml

nonselected_item.xml

Layouting

Project ini menggunakan 2 buat layout, yaitu untuk activity dan fragment :

  1. activity_main.xml 
  2. fragment_dinamis.xml

activity_main.xml

File ini berisi view viewpager beserta indikatornya (titik-titik penanda fragment). Kodenya seperti dibawah ini :


fragment_dinamis.xml

File ini berisi attribute-attribute yang akan di tampilkan pada fragment, biasanya sesuai dengan item yang ada di list datanya. Pada project ini saya hanya menggunakan textview sebagai penanda nomor fragment (kalian bisa edit sesuai dengan kebutuhan). Kodenya seperti dibawah ini :

Kodingan di java

Pada file javanya, akan digunakan 3 class, antara lain :

  1. DinamisFragment.java
  2. FragmentAdapter.java
  3. MainActivity.java

 
DinamisFragment.java

Class ini adalah class fragment. Kita hanya menyiapkan satu fragment sisanya nanti kita kondisikan sesuai jumlah item pada listnya. Jika listnya lebih dari satu, maka fragmentnyapun akan lebih dari satu. Kodingannya seperti dibawah ini :


Tidak ada yang special dari kodingan fragment diatas, hanya set-set biasa aja. Loginya penambahan fragment akan terjadi di adapternya.

Perhatikan method setDetail(). Method ini akan digunakan di adapter, kenapa diadapter?

Flownya gini : Karena data kan didapat dari activity, kemudian data dibawa ke adapter, dari adapter barulah kita set ke fragmentnya.

FragmentAdapter.java

Pada file ini akan dibuat login bagaimana caranya menampilkan fragment berdasarkan banyaknya item yang ada pada list. Kodenya seperti dibawah ini :

Perhatikan attribute fragments. Attribute tersebut dibuat array ([]), karna memang jumlah datanya bakalan dinamis, maka di fragment juga dibuat dinamis (berbentuk array).

Perhatikan lagi pada method getItem(int position). Didalamnya ada fungsi begini : dinamisFragment.setDetail(items). Method setDetail() didapat dari DinamisFragment (yang telah disampaikan sebelumnya).

MainActivity.java

File ini seperti biasanya adalah tempat dimana kita mengisi list dengan data. List tersebut akan kita lempar ke adapter. Kodenya seperti dibawah ini :

Kenapa pada file ini ada proses implements ViewPager.OnPageChangeListener?

Itu digukanan untuk mendeteksi ketika viewpager di swap/digeser. Tujuannya untuk merubah indikator yang aktif yang mana, misalnya viewpager diswap ke fragment 2, maka indikator ke 2 lah yang akan aktif.

Sekian tutorialnya, jika ada yang kurang jelas silakan ditanyakan. Semoga bermanfaat.

(Visited 66 times, 1 visits today)

Related Posts

About The Author

Berlangganan Artikel

Untuk mendaftarkan tutorial pemrograman terbaru dari putuguna[dot]com, silakan tuliskan email kalian dibawah ini