Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Divide elements on groups in RecyclerView

I need to divide elements in RecyclerView on groups with titles (like in the Inbox app on the picture below) so help me please to figure out what approach would be better for my case: 1) I can use Heterogenous layouts for it but it is not so convenient to insert new elements in groups (because I need check if elements of the same group is already added or I need to add new divider). So in this case I'll wrap all operations with such data structure into a separate class.

2) Theoretically I can wrap each group in its own RecyclerView with label is it a good idea?

Inbox app

like image 670
Leo Avatar asked Jan 18 '16 06:01

Leo


People also ask

How do I add a separator in RecyclerView?

We have to create a default Divider using addItemDecoration() method with the RecyclerView instance, we need to pass the ItemDecoration(in this case it is DividerItemDecoration()) instance and the orientation of the LayoutManager(in this case it is vertical) of the recycler view.

How to group items by date in RecyclerView?

You need to first sort them based on the date. then use either view_type (Is there an addHeaderView equivalent for RecyclerView?) as @G.K mentioned or use any recycler header library to set them as sticky headers.

How do you get the item count in RecyclerView Kotlin?

You can retrieve count by using the ArrayList's size() method. So, in your case you can calculate using episodeList. size() .


1 Answers

For example you can:

  1. Use a TreeMap<Date,List<Event>> for splitting elements by date. This will be a collection for keeping your business objects. Of course if you already have a similar structure you can keep it. It's just important to have something for easily building list of items for populating UI with right elements order.

  2. Define a dedicated abstract type for List items (e.g. ListItem) to wrap your business objects. Its implementation could be something like this:

    public abstract class ListItem {      public static final int TYPE_HEADER = 0;     public static final int TYPE_EVENT = 1;      abstract public int getType(); }  
  3. Define a class for each of your List element type (here I added just two types but you can use many as you need):

    public class HeaderItem extends ListItem {      private Date date;      // here getters and setters      // for title and so on, built     // using date      @Override     public int getType() {         return TYPE_HEADER;     }  }  public class EventItem extends ListItem {      private Event event;      // here getters and setters      // for title and so on, built      // using event      @Override     public int getType() {         return TYPE_EVENT;     }  } 
  4. Create a List as follows (where mEventsMap is map build at point 1):

    List<ListItem> mItems; // ... mItems = new ArrayList<>(); for (Date date : mEventsMap.keySet()) {     HeaderItem header = new HeaderItem();     header.setDate(date);      mItems.add(header);     for (Event event : mEventsMap.get(date)) {         EventItem item = new EventItem();         item.setEvent(event);         mItems.add(item);     } } 
  5. Define an adapter for your RecyclerView, working on List defined at point 4. Here what is important is to override getItemViewType method as follows:

    @Override public int getItemViewType(int position) {     return mItems.get(position).getType(); } 

    Then you need to have two layouts and ViewHolder for header and event items. Adapter methods should take care of this accordingly:

    @Override public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {     if (viewType == ListItem.TYPE_HEADER) {         View itemView = mLayoutInflater.inflate(R.layout.view_list_item_header, parent, false);         return new HeaderViewHolder(itemView);     } else {         View itemView = mLayoutInflater.inflate(R.layout.view_list_item_event, parent, false);         return new EventViewHolder(itemView);     } }   @Override public void onBindViewHolder(final RecyclerView.ViewHolder viewHolder, final int position) {     int type = getItemViewType(position);     if (type == ListItem.TYPE_HEADER) {         HeaderItem header = (HeaderItem) mItems.get(position);         HeaderViewHolder holder = (HeaderViewHolder) viewHolder;         // your logic here     } else {                     EventItem event = (EventItem) mItems.get(position);         EventViewHolder holder = (EventViewHolder) viewHolder;         // your logic here     } } 

Here it is a repository on GitHub providing an implementation of the approach explained above.

like image 101
thetonrifles Avatar answered Sep 20 '22 05:09

thetonrifles