Easy Tutorial Android Expandable RecyclerView

Today i going to share a awesome tutorial using recyclerview. As usual, you may use ListView for creating a collapse and expand view, right?

We using listview with reason that listview have a view called ExpandableListView, so we just set the data through ExapandableListView.

But in several case, your application required a Recyclerview (I don't know what it is) instead of Listview.

Indeed, create a expandable view using recyclerview is more difficult that using ExpandableListview. You have to create all materials or view not just set the data.

But don't worry, i have spent several hours just to create simple expandable view using recyclerview, with hope you will easy to understand the steps.

PREPARATION

Compile the following libraries :

compile 'com.android.support:design:23.2.0'
compile 'com.android.support:cardview-v7:23.2.0'
compile 'com.android.support:recyclerview-v7:23.2.0'

After that, download LIB MODULE EXPANDABLE , extract and then place in your main package. Confuse? Take a look at Figure 1 :

Figure 1

Place the LIB MODULE EXPANDABLE look like figure 1.

IMPLEMENTATION

Create new 3 xml layouts :

1. activity_main.xml
2. item_list_parent.xml
3. item_list_child.xml

At Figure 1, there are several packages that have some java classes.

Package models

1. BiodataChildModel.java
2. BiodataParentModel.java

Package expandables

1. BiodataChildViewHolder.java
2. BiodataParentViewHolder.java
3. BiodataExpandable.java

And last, definitely MainActivity.java.

First, modify the layouts that we've prepared.

activity_main.xml. Paste the following code :

item_list_child.xml. Paste the following code :

item_list_parent.xml. Paste the following code :

Second, we modify the code of all the java classes inside the package models. Why this package is first? Because this classes will use in next next java classes.

1. Package MODELS

Open BiodataChildModel.java. This class store all the data that will show on expand view. Paste the following code :

Then modify class BiodataParentModel.java. This class contains data from class BiodataChildModel and set as a list.

Because this class as the parent, you have to extends ParentListItem. After you do extends, you have to implements its methods. Take a look at the following code  :

Attention :
Make sure you have returned mListChild in method getChildItemList()

2. Package EXPANDABLES

Open class BiodataChildViewHolder.java. Paste the following code :

Open class BiodataParentViewHolder.java. Paste the following code :

In code above there are method :

1. setExpanded(boolean expanded) 
2. onExpansionToggled(boolean expanded) . 

Those method used to create an animation of the imageview (icon + and -) when the view is expand or collapse. You can see on the video demo above.

Open class BiodataExpandable.java. Paste the following code :

All the class that used to create expandable has done. Time to input the data and set adapter in your MainActivity.java. Paste the following code :

Done!!! Run your project, hope the project is running well :D. Thank you.

Download the project here