(Tutorial Android) Implement Pagination In Recyclerview


Pagination merupakan suatu metode yang dipakai untuk membatasi data yang ditampilkan. Dengan menerapkan pagination, maka jumlah data yang ditampilkan per halamannya dibatasi, sehingga tidak perlu pribadi mengambil semua data. Pada tutorial kali ini aku akan membahas cara menerapkan pagination di RecyclerView. Untuk itu aku anjurkan untuk melihat postingan aku tentang (Tutorial Android) RecyclerView and CardView Android Material Design

Oke kita akan memakai project dari postingan sebelumnya, hanya kita akan modifikasi sedikit.

Pertama, buat layout untuk menampilkan progressbar. Progressbar akan muncul dibagian bawah list dikala di scroll.

footer_loading.xml


Selanjutnya kita akan menambahkan progressbar tadi sebagai footer di RecyclerView. Modifikasi kelas MemberListAdapter.java berikut. 

package wim.example.com.androidpaging.adapter;  package wim.example.com.androidpaging.adapter;  import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.ProgressBar; import android.widget.TextView;  import java.util.ArrayList; import java.util.List;  import wim.example.com.androidpaging.R; import wim.example.com.androidpaging.model.Member;  /**  * Created by wim on 4/6/16.  */ public class MemberListAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {      private simpulan int VIEW_TYPE_ITEM = 0;     private simpulan int VIEW_TYPE_LOADING = 1;      private boolean loading = true;      private List<Member> memberList;     private OnItemClickListener onItemClickListener;      public MemberListAdapter() {         memberList = new ArrayList<>();     }      private void add(Member item) {         memberList.add(item);         notifyItemInserted(memberList.size());     }      public void addAll(List<Member> memberList) {         for (Member member : memberList) {             add(member);         }     }      public void remove(Member item) {         int position = memberList.indexOf(item);         if (position > -1) {             memberList.remove(position);             notifyItemRemoved(position);         }     }      public void clear() {         while (getItemCount() > 0) {             remove(getItem(0));         }     }      public Member getItem(int position){         return memberList.get(position);     }      @Override     public int getItemViewType (int position) {         if(isPositionFooter (position)) {             return VIEW_TYPE_LOADING;         }         return VIEW_TYPE_ITEM;     }      private boolean isPositionFooter (int position) {         return position == memberList.size();     }      @Override     public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {         if (viewType == VIEW_TYPE_ITEM) {             View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item_member, parent, false);             return new MemberViewHolder(view, onItemClickListener);         } else if (viewType == VIEW_TYPE_LOADING) {             View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.footer_loading, parent, false);             return new LoadingViewHolder(view);         }          return null;     }      @Override     public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {          if (holder instanceof MemberViewHolder) {             MemberViewHolder memberViewHolder = (MemberViewHolder) holder;              simpulan Member member = memberList.get(position);              memberViewHolder.memberThumb.setImageResource(member.getThumb());             memberViewHolder.memberName.setText(member.getName());             memberViewHolder.memberTeam.setText(member.getTeam());          } else if (holder instanceof LoadingViewHolder) {             LoadingViewHolder loadingViewHolder = (LoadingViewHolder) holder;             loadingViewHolder.progressBar.setIndeterminate(true);             loadingViewHolder.progressBar.setVisibility(loading ? View.VISIBLE : View.GONE);         }      }      public void setLoading(boolean loading){         this.loading = loading;     }      @Override     public int getItemCount() {         return memberList == null ? 0 : memberList.size() + 1;     }      @Override     public void onAttachedToRecyclerView(RecyclerView recyclerView) {         super.onAttachedToRecyclerView(recyclerView);     }      @Override     public void onDetachedFromRecyclerView(RecyclerView recyclerView) {         super.onDetachedFromRecyclerView(recyclerView);     }      public void setOnItemClickListener(OnItemClickListener onItemClickListener) {         this.onItemClickListener = onItemClickListener;     }      static class MemberViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {          ImageView memberThumb;         TextView memberName;         TextView memberTeam;          OnItemClickListener onItemClickListener;          public MemberViewHolder(View itemView, OnItemClickListener onItemClickListener) {             super(itemView);              memberThumb = (ImageView) itemView.findViewById(R.id.thumb);             memberName = (TextView) itemView.findViewById(R.id.name);             memberTeam = (TextView) itemView.findViewById(R.id.team);              itemView.setOnClickListener(this);             this.onItemClickListener = onItemClickListener;         }          @Override         public void onClick(View v) {             onItemClickListener.onItemClick(v, getAdapterPosition());         }     }      static class LoadingViewHolder extends RecyclerView.ViewHolder {         public ProgressBar progressBar;          public LoadingViewHolder(View itemView) {             super(itemView);              progressBar = (ProgressBar) itemView.findViewById(R.id.loading);         }     }       public interface OnItemClickListener {          void onItemClick(View view, int position);     } }

Lalu kita akan mengimplementasikan pagination dengan RecyclerView.OnScrollListener pada RecyclerView. 
private RecyclerView.OnScrollListener recyclerViewOnScrollListener = new RecyclerView.OnScrollListener() {      @Override     public void onScrollStateChanged(RecyclerView recyclerView, int newState) {         super.onScrollStateChanged(recyclerView, newState);     }      @Override     public void onScrolled(RecyclerView recyclerView, int dx, int dy) {         super.onScrolled(recyclerView, dx, dy);         int visibleItemCount = linearLayoutManager.getChildCount();         int totalItemCount = linearLayoutManager.getItemCount();         int firstVisibleItemPosition = linearLayoutManager.findFirstVisibleItemPosition();         if (!isLoading && !isLastPage) {             if ((visibleItemCount + firstVisibleItemPosition) >= totalItemCount                     && firstVisibleItemPosition >= 0                     && totalItemCount >= PAGE_SIZE) {    isLoading = true;    // load more data here              }         }     } };

Lalu modifikasi kelas MemberFragment.java berikut.
package wim.example.com.androidpaging.fragments;  import android.content.Context; import android.os.Bundle; import android.os.Handler; import android.support.annotation.Nullable; import android.support.v4.app.Fragment; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.Toast;  import java.util.ArrayList; import java.util.List;  import wim.example.com.androidpaging.R; import wim.example.com.androidpaging.adapter.MemberListAdapter; import wim.example.com.androidpaging.model.Member;  /**  * Created by wim on 4/5/16.  */ public class MemberFragment extends Fragment {      private int PAGE_SIZE = 6;      private boolean isLastPage = false;     private boolean isLoading = false;      private RecyclerView listMember;     private LinearLayoutManager linearLayoutManager;     private MemberListAdapter memberListAdapter;      protected Context context;      int thumb[] = {R.drawable.acha, R.drawable.yupi, R.drawable.della,             R.drawable.kinal, R.drawable.uty, R.drawable.shafa,             R.drawable.hanna, R.drawable.lidya, R.drawable.nadila,             R.drawable.nat, R.drawable.sisil, R.drawable.viny,             R.drawable.chika_chan, R.drawable.ikha, R.drawable.ayen,             R.drawable.saktia, R.drawable.dudut, R.drawable.yona};      String name[] = {"Alicia Chanzia", "Cindy Yuvia", "Della Delila", "Devi Kinal Putri",             "Dwi Putri Bonita", "Fakhriyani Shafariyanti", "Jennifer Hanna", "Lidya Maulida Djuhandar",             "Nadila Cindi Wantari", "Natalia", "Priscillia Sari Dewi", "Ratu Vienny Fitrilya",             "Rina Chikano", "Riskha Fairunissa", "Rona Anggreani", "Saktia Oktapyani",             "Sinka Juliani", "Viviyona Apriani"};      String motto[] = {"Hap!Tangkap Aku!", "Mau Kemana Kita?", "Future Processor", "K3bahagiaan Depi",             "Different", "Shafa Disana?", "Target", "Banyak Mau", "Yossha Ikuzo!", "Spicy Hot",             "Yuk Isi Batre Senter", "#KitaBisa", "Yuk.. Kita Dangdutan!", "Nothing Gonna Stop Us Now",             "Stand Up!", "Saktia Dalam Jiwa", "Berarti Dalam Hidup", "Life In Technicolor"};      public static MemberFragment newInstance(){         return new MemberFragment();     }      @Override     public void onAttach(Context context) {         super.onAttach(context);         this.context = context;     }      @Nullable     @Override     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {         View rootView = inflater.inflate(R.layout.fragment_member, container, false);          listMember = (RecyclerView) rootView.findViewById(R.id.listMember);          return rootView;     }      @Override     public void onActivityCreated(@Nullable Bundle savedInstanceState) {         super.onActivityCreated(savedInstanceState);          linearLayoutManager = new LinearLayoutManager(context);         memberListAdapter = new MemberListAdapter();          listMember.setLayoutManager(linearLayoutManager);         listMember.setAdapter(memberListAdapter);         listMember.addOnScrollListener(recyclerViewOnScrollListener);          initData();         initListener();     }      private void initData(){         List<Member> memberList = new ArrayList<>();         Member member;          for(int i=0; i < PAGE_SIZE; i++){             member = new Member();              member.setId(i+1);             member.setName(name[i]);             member.setTeam(motto[i]);             member.setThumb(thumb[i]);              memberList.add(member);         }          memberListAdapter.addAll(memberList);      }      private void loadData(){         isLoading = false;          List<Member> memberList = new ArrayList<>();         Member member;          int index = memberListAdapter.getItemCount() - 1;         int end = index + PAGE_SIZE;          if (end <= thumb.length) {             for (int i = index; i < end; i++) {                 member = new Member();                  member.setId(i + 1);                 member.setName(name[i]);                 member.setTeam(motto[i]);                 member.setThumb(thumb[i]);                  memberList.add(member);             }             memberListAdapter.addAll(memberList);             if(end >= thumb.length){                 memberListAdapter.setLoading(false);             }         }      }      private void initListener() {         memberListAdapter.setOnItemClickListener(new MemberListAdapter.OnItemClickListener() {             @Override             public void onItemClick(View view, int position) {                 Toast.makeText(context, "Clicked at index "+ position, Toast.LENGTH_SHORT).show();             }         });     }      @Override     public void onDestroyView() {         super.onDestroyView();     }      private RecyclerView.OnScrollListener recyclerViewOnScrollListener = new RecyclerView.OnScrollListener() {         @Override         public void onScrollStateChanged(RecyclerView recyclerView, int newState) {             super.onScrollStateChanged(recyclerView, newState);         }          @Override         public void onScrolled(RecyclerView recyclerView, int dx, int dy) {             super.onScrolled(recyclerView, dx, dy);             int visibleItemCount = linearLayoutManager.getChildCount();             int totalItemCount = linearLayoutManager.getItemCount();             int firstVisibleItemPosition = linearLayoutManager.findFirstVisibleItemPosition();              if (!isLoading && !isLastPage) {                 if ((visibleItemCount + firstVisibleItemPosition) >= totalItemCount                         && firstVisibleItemPosition >= 0                         && totalItemCount >= PAGE_SIZE) {                     isLoading = true;                      new Handler().postDelayed(new Runnable() {                         @Override                         public void run() {                             loadData();                         }                     }, 2000);                 }             }         }     }; }

Deploy dan jalankan maka akhirnya menyerupai ini, terlihat progressbar dibagian bawah.
*sory bila TS nya ngidol :v


Source code lengkap sanggup dilihat di https://github.com/andronut/AndroidPagingRecyclerView

Sekian dan supaya bermanfaat.
Happy Coding :)

Comments

Post a Comment

Popular posts from this blog

Pewarnaan Objek Geometri Di Java 2D

Image
Pewarnaan (filling) sanggup diterapkan ke dalam pembuatan objek geometri. Objek geometri sanggup digambar dengan method fill atau draw . Untuk menambahkan warna pada objek geometri, kita sanggup menambahkan method dari kelas Graphics. void setColor(Color c)  Objek Color didefinisikan sebagai sebuah warna. Kelas Color secara default memakai rentan warna RGB. Berikut ini yaitu pola penggunaan Color di Java 2D. /** * * @author Wim Sonevel */ import java.awt.*; import java.awt.geom.*; import javax.swing.*; public class SegiPanjangWarna extends JApplet { public static void main(String[] args) { JFrame frame = new JFrame(); frame.setTitle("Persegi Panjang Warna"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new SegiPanjangWarna(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } @Override public void init() { JPan...
Read more

Tugas Komplemen Terakhir

(Ainun Najib) 1. Buat sebuah aplikasi berbasis GUI untuk registrasi siswa gres : - hitung nilai tes untuk mata pelajaran tertentu dan jikalau rata-rata <  70 maka gagal - inputkan data-data siswa dan simpan dalam database - tampilkan data dalam bentuk tabel - data sanggup disimpan, diedit, dihapus dan dicari (Moh. Fachrudin) 2. Buat sebuah aplikasi berbasis GUI untuk registrasi musyrif gres : - hitung nilai tes b.arab, b.ing, Afkar, dan Al-Quran dan jikalau rata - rata < 70 maka gagal - inputkan data-data siswa dan simpan dalam database - tampilkan data dalam bentuk tabel - data sanggup disimpan, diedit, dihapus dan dicari (Aulia) 3. Buat sebuah aplikasi berbasis GUI untuk menghitung nilai selesai suatu matakuliah dan berikan nilai huruf.    - Rumus nilai selesai = kiprah 20% + uts 30% + uas 50 %    - Berikan nilai karakter :       46-55 Nilai C         56-65 Nilai C+  ...
Read more

Konsep Oop Encapsulation

Image
Encapsulation biasa disebut dengan Information Hidding. Encapsulation merupakan kombinasi dari data dan method pada paket suatu kelas dan menyembunyikan implementasi detail dari user terhadap object. Hak jalan masuk diatur dalam sebuah access modifier yang diantaranya yakni : - private : hanya sanggup diakses oleh kelas itu sendiri - protected : hanya sanggup diakses dalam package dan kelas turunannya - public : sanggup diakses dimanapun - default : hanya sanggup diakses dalam package saja Manfaat dari encapsulation : - Modularitas : Source code dari sebuah class sanggup dikelola secara independen dari source code class yang lain. Perubahan internal pada sebuah class tidak akan besar lengan berkuasa bagi class yang menggunakannya. - Information Hiding : Penyembunyian gosip yang tidak perlu diketahui objek lain. Untuk mengakses gosip sanggup memakai mediator method yang dikenal dengan setter dan getter. Sebagai contoh, buatlah 3 kelas masing-masing di package yang berbed...
Read more