Nested RecyclerView or Inner Recycler View in android

Nested RecyclerView Example

Recyclerview is a flexible view for providing a limited window into a large data set.

I am going to display below layout using two recycler views(nested recycler views).

Follow below steps to achieve Nested/Inner Recycler view.

1.copy these dependencies and paste it to app level grade file

compile 'com.android.support:appcompat-v7:24.2.1'
        compile 'com.android.support:recyclerview-v7:24.2.+'
        compile 'com.android.support:cardview-v7:24.2.+'

make sure youd have 24+ android sdk.

/******************************************************************************/
2.copy these model classes

a.EventInformationClass, this class contains dates list and its events list

    public class EventInformation {
    
    private ArrayList<EventDates> eventsDatesList = new ArrayList<>();

    public ArrayList<EventDates> getEventsDatesList() {
        return eventsDatesList;
    }

    public void setEventsDatesList(ArrayList<EventDates> eventsDatesList) {
        this.eventsDatesList = eventsDatesList;
    }
}


b.EventDate class, this class contains list of dates(headings), it contains the list of events on that date.

public class EventDates {
    private String date;
    private ArrayList<Events> eventsArrayList;

    public String getDate() {
        return date;
    }

    public void setDate(String date) {
        this.date = date;
    }

    public ArrayList<Events> getEventsArrayList() {
        return eventsArrayList;
    }

    public void setEventsArrayList(ArrayList<Events> eventsArrayList) {
        this.eventsArrayList = eventsArrayList;
    }
}

c.Events class, this class contains event name and event id

public class Events {
    private String eventId;
    private String eventName;

    public String getEventId() {
        return eventId;
    }

    public void setEventId(String eventId) {
        this.eventId = eventId;
    }

    public String getEventName() {
        return eventName;
    }

    public void setEventName(String eventName) {
        this.eventName = eventName;
    }
}
/************************************************************************/

3.create layouts

a.activity_main.xml, this layout corresponds to main activity

<RelativeLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <android.support.v7.widget.RecyclerView
           android:id="@+id/event_recycler_view_parent"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:scrollbars="vertical" />
</RelativeLayout>

b.event_list_parent_item.xml, this layout corresponds to parent info(here am showing only date and (parent)recyclerview)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:focusable="true"
    android:clickable="true"
    android:background="?android:attr/selectableItemBackground"
    android:orientation="vertical">

    <TextView
        android:id="@+id/event_list_parent_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <android.support.v7.widget.RecyclerView
        android:layout_below="@+id/event_list_parent_date"
        android:id="@+id/event_recycler_view_child"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
         />

</RelativeLayout>

c.event_list_child_item.xml, this layout corresponds to list of events under each dates

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:layout_margin="10dp"
        android:layout_width="match_parent"
        android:layout_height="48dp">
        <TextView
            android:id="@+id/event_list_event_name"
            android:paddingLeft="10dp"
            android:layout_gravity="center_vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </android.support.v7.widget.CardView>

</LinearLayout>

/***************************************************************************************/
4.create main activity, data is in json. you should import import org.json.*; to parse json into objects (i deliberately left some data. ex: id and name.)

public class MainActivity extends AppCompatActivity {

    RecyclerView event_recycler_view_parent;
    EventListParentAdapter event_list_parent_adapter;
    
    String jsonString = "{\n" +
            "    \"Id\" : \"1\",\n" +
            "    \"Name\" : \"Ganesha\",\n" +
            "    \"Location\" : \"Bengaluru\",\n" +
            "    \"Event info\" : [ \n" +
            "\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\"Date\" : \"29-9-16\",\n" +
            "\t\t\t\t\t\t\t\"events\" : [ \n" +
            "\t\t\t\t\t\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventId\" : \"1\",\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventName\" : \"event one\"\n" +
            "\t\t\t\t\t\t\t\t\t\t\t}, \n" +
            "\t\t\t\t\t\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventId\" : \"2\",\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventName\" : \"event two\"\n" +
            "\t\t\t\t\t\t\t\t\t\t\t}\n" +
            "\t\t\t\t\t\t\t\t\t\t]\n" +
            "\t\t\t\t\t\t}, \n" +
            "\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\"Date\" : \"30-9-16\",\n" +
            "\t\t\t\t\t\t\t\"events\" : [ \n" +
            "\t\t\t\t\t\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventId\" : \"3\",\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventName\" : \"event three\"\n" +
            "\t\t\t\t\t\t\t\t\t\t\t}, \n" +
            "\t\t\t\t\t\t\t\t\t\t\t{\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventId\" : \"4\",\n" +
            "\t\t\t\t\t\t\t\t\t\t\t\t\"eventName\" : \"event four\"\n" +
            "\t\t\t\t\t\t\t\t\t\t\t}\n" +
            "\t\t\t\t\t\t\t\t\t\t]\n" +
            "\t\t\t\t\t\t}\n" +
            "\t\t\t\t\t]\n" +
            "}";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ArrayList<EventDates> eventDatesArrayList;
        EventInformation eventInformation = new EventInformation();;
        
         try {
             //pasing jason data
            JSONObject jsonObject = new JSONObject(jsonString);
            JSONArray jsonDatesArray = jsonObject.getJSONArray("Event info");
            eventDatesArrayList = new ArrayList<>();
            for (int indexDates=0;indexDates<jsonDatesArray.length();indexDates++){
                EventDates eventDates = new EventDates();
                JSONObject jsonDateobject = jsonDatesArray.getJSONObject(indexDates);
                String date = jsonDateobject.getString("Date");
                eventDates.setDate(date);
                JSONArray jsonArrayevents = jsonDateobject.getJSONArray("events");
                ArrayList<Events> eventsArrayList = new ArrayList<>();
                for (int indexEvents=0;indexEvents<jsonArrayevents.length();indexEvents++){
                    Events events = new Events();
                    JSONObject eventObj = jsonArrayevents.getJSONObject(indexEvents);
                    events.setEventId(eventObj.getString("eventId"));
                    events.setEventName(eventObj.getString("eventName"));
                    eventsArrayList.add(events);
                }
                eventDates.setEventsArrayList(eventsArrayList);
                eventDatesArrayList.add(eventDates);
            }
            eventInformation.setEventsDatesList(eventDatesArrayList);
            Log.d("message",eventInformation.toString());
        }catch (Exception e){

        }
        //parent recyclerview
        event_recycler_view_parent = (RecyclerView) findViewById(R.id.event_recycler_view_parent);
        event_list_parent_adapter = new EventListParentAdapter(eventInformation,MainActivity.this);
        event_recycler_view_parent.setHasFixedSize(true);
        RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
        event_recycler_view_parent.setLayoutManager(mLayoutManager);
        event_recycler_view_parent.setItemAnimator(new DefaultItemAnimator());
        event_recycler_view_parent.setAdapter(event_list_parent_adapter);


    }
}
/*******************************************************************************/
5.copy adapters
  EventListParentAdapter class, this used for parent data(date)
  
  public class EventListParentAdapter extends     RecyclerView.Adapter<EventListParentAdapter.MyViewHolder> {

    //private List<Movie> moviesList;

    private EventInformation eventInformation;
    private Activity activity;

    public EventListParentAdapter(EventInformation eventInformation,Activity activity) {
        this.eventInformation = eventInformation;
        this.activity = activity;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.event_list_parent_item, parent, false);

        return new MyViewHolder(itemView);
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        EventDates eventDates = eventInformation.getEventsDatesList().get(position);
        holder.event_list_parent_date.setText(eventDates.getDate());

        LinearLayoutManager hs_linearLayout = new LinearLayoutManager(this.activity, LinearLayoutManager.VERTICAL, false);
        holder.event_recycler_view_child.setLayoutManager(hs_linearLayout);
        holder.event_recycler_view_child.setHasFixedSize(true);
        EventListChildAdapter eventListChildAdapter = new EventListChildAdapter(this.activity,eventInformation.getEventsDatesList().get(position).getEventsArrayList());
        holder.event_recycler_view_child.setAdapter(eventListChildAdapter);

    }

    @Override
    public int getItemCount() {
        return eventInformation.getEventsDatesList().size();
    }

    public class MyViewHolder extends RecyclerView.ViewHolder {
        public TextView event_list_parent_date;
        public RecyclerView event_recycler_view_child;

        public MyViewHolder(View view) {
            super(view);
            event_list_parent_date = (TextView) view.findViewById(R.id.event_list_parent_date);
            event_recycler_view_child = (RecyclerView)view.findViewById(R.id.event_recycler_view_child);
        }
    }
}
/******************************************************************************//
6.copy EventListChildAdapter class , it is used to child data

public class EventListChildAdapter extends RecyclerView.Adapter<EventListChildAdapter.MyViewHolder> {

    //private List<Movie> moviesList;

    private EventInformation eventInformation;
    private ArrayList<Events> eventsArrayList;
    private Activity activity;

    public EventListChildAdapter(Activity activity,ArrayList<Events> eventsArrayList) {
        this.eventsArrayList = eventsArrayList;
        this.activity = activity;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.event_list_child_item, parent, false);
        return new MyViewHolder(itemView);
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder,final int position) {
        Events events = eventsArrayList.get(position);
        holder.event_list_event_name.setText(events.getEventName());
        holder.event_list_event_name.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Log.d("event name=",eventsArrayList.get(position).getEventName());
            }
        });



    }

    @Override
    public int getItemCount() {
        return eventsArrayList.size();
    }

    public class MyViewHolder extends RecyclerView.ViewHolder {
        public TextView event_list_event_name;


        public MyViewHolder(View view) {
            super(view);
            event_list_event_name = (TextView) view.findViewById(R.id.event_list_event_name);

        }
    }
}


/**************************************************************************************/


Keywords: inner recycler view, nested recycler view , recyclerview within recyclerview