
Expandable RecyclerView in Android
Expandable recyclerView is a one of the most important feature in Android it is easily created our application using Expandable RecyclerView Library.
Expandable RecyclerView is a two contain view. parent view and child view. Parent is visible by default but the child view has to be expanded and collapsed. you can click on parent view to expand in recyclerView.
In this recyclerView is create two layout xml file is parent and child and then bind the adapter in different different view holder.you can create child holder and then create parent holder and this holder is bind the expandable recyclerView adapter.
Expandable recyclerView is provided two different different methods in bind holder.it is onCreateGroupViewHolder and then onCreateChildViewHolder methods are declared. onCreateGroupViewHolder is a bind on parent view and then onCreateChildViewHolder is bind on child view.
Now this recyclerView set the adapter and then run the application in your device to by default visibility parent view. you can click on parent view to expand this view and then open child view. you can another click on parent view to hide child view in recyclerView.
Example of Expandable RecyclerView in Android How to work Expandable RecyclerView ?
Implement Dependency in app level build.gradle File.
1 2 3 |
implementation 'com.thoughtbot:expandablerecyclerview:1.0' implementation 'com.android.support:recyclerview-v7:28.0.0-alpha3' implementation 'com.android.support:cardview-v7:28.0.0-alpha3' |
Create activity_main.xml File Follow this code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="16dp" tools:context=".MainActivity"> <android.support.v7.widget.RecyclerView android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="wrap_content" /> </RelativeLayout> |
Create item_parent.xml File Follow this code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<?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:padding="10dp"> <TextView android:id="@+id/tv_parent_item" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:drawablePadding="5dp" android:drawableRight="@drawable/down_arrow" android:gravity="left|center" android:padding="10dp" android:textSize="20dp" android:textColor="#0784b1" /> </RelativeLayout> |
Create item_child.xml File Follow this code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:padding="5dp" android:layout_height="wrap_content"> <TextView android:id="@+id/tv_child_item" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:textSize="18dp" android:textColor="#ca2450" android:padding="10dp" /> </RelativeLayout> |
Create MainActivity.java File Follow this code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.DividerItemDecoration; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { RecyclerView recyclerView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); recyclerView = (RecyclerView) findViewById(R.id.recycler_view); List<ParentData> list = getList(); recyclerView.setLayoutManager(new LinearLayoutManager(this)); MyAdapter myAdapter = new MyAdapter(MainActivity.this,list); recyclerView.setAdapter(myAdapter); recyclerView.addItemDecoration(new DividerItemDecoration(this,LinearLayoutManager.VERTICAL)); recyclerView.setAdapter(myAdapter); } private List<ParentData> getList() { List<ParentData> list_parent =new ArrayList<>(); List<ChildData> list_data_child = new ArrayList<>(); list_data_child.add(new ChildData("First")); list_data_child.add(new ChildData("Second")); list_data_child.add(new ChildData("Third")); list_data_child.add(new ChildData("Four")); list_parent.add(new ParentData("Parent 1",list_data_child)); list_parent.add(new ParentData("Parent 2",list_data_child)); list_parent.add(new ParentData("Parent 3",list_data_child)); list_parent.add(new ParentData("Parent 4",list_data_child)); return list_parent; } } |
Create ParentData.java File Follow this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.annotation.SuppressLint; import com.thoughtbot.expandablerecyclerview.models.ExpandableGroup; import java.util.List; @SuppressLint("ParcelCreator") public class ParentData extends ExpandableGroup<ChildData>{ public ParentData(String title, List<ChildData> items){ super(title,items); } } |
Create ChildData.java File Follow this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.os.Parcel; import android.os.Parcelable; public class ChildData implements Parcelable{ String name; public ChildData(Parcel parcel){ name = parcel.readString(); } public ChildData(String name) { this.name = name; } public String getName() { return name; } public void setName(String name) { this.name = name; } public static final Creator<ChildData> CREATOR = new Creator<ChildData>() { @Override public ChildData createFromParcel(Parcel in) { return new ChildData(in); } @Override public ChildData[] newArray(int size) { return new ChildData[size]; } }; @Override public int describeContents() { return 0; } @Override public void writeToParcel(Parcel parcel, int i) { parcel.writeString(name); } } |
Create ParentViewHolder.java File Follow this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.view.View; import android.widget.TextView; import com.thoughtbot.expandablerecyclerview.models.ExpandableGroup; import com.thoughtbot.expandablerecyclerview.viewholders.GroupViewHolder; public class ParentViewHolder extends GroupViewHolder{ public TextView textView_parent; public ParentViewHolder(View itemView) { super(itemView); textView_parent = itemView.findViewById(R.id.tv_parent_item); } @Override public void expand() { super.expand(); textView_parent.setCompoundDrawablesWithIntrinsicBounds(0,0,R.drawable.down_arrow,0); } @Override public void collapse() { super.collapse(); textView_parent.setCompoundDrawablesWithIntrinsicBounds(0,0,R.drawable.up_arrow,0); } public void setGroupName(ExpandableGroup groupName){ textView_parent.setText(groupName.getTitle()); } } |
Create ChildViewHolders.java File Follow this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.view.View; import android.widget.TextView; import com.thoughtbot.expandablerecyclerview.models.ExpandableGroup; import com.thoughtbot.expandablerecyclerview.viewholders.ChildViewHolder; public class ChildViewHolders extends ChildViewHolder{ public TextView textView_child; public ChildViewHolders(View itemView) { super(itemView); textView_child = itemView.findViewById(R.id.tv_child_item); } public void setChildText(String name){ textView_child.setText(name); } } |
Create MyAdapter.java File Follow this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
package com.example.bhaumik.expandablerecyclerviewdemo; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.Toast; import com.thoughtbot.expandablerecyclerview.ExpandableRecyclerViewAdapter; import com.thoughtbot.expandablerecyclerview.models.ExpandableGroup; import java.util.List; public class MyAdapter extends ExpandableRecyclerViewAdapter<ParentViewHolder,ChildViewHolders>{ public Context context; public MyAdapter(Context context,List<? extends ExpandableGroup> groups) { super(groups); this.context = context; } @Override public ParentViewHolder onCreateGroupViewHolder(ViewGroup parent, int viewType) { LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); View view = inflater.inflate(R.layout.item_parent,parent,false); return new ParentViewHolder(view); } @Override public ChildViewHolders onCreateChildViewHolder(ViewGroup parent, int viewType) { LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); View view = inflater.inflate(R.layout.item_child,parent,false); return new ChildViewHolders(view); } @Override public void onBindChildViewHolder(ChildViewHolders holder, int flatPosition, ExpandableGroup group, int childIndex) { final ChildData childData = ((ParentData)group).getItems().get(childIndex); holder.setChildText(childData.getName()); holder.textView_child.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(context, "Selected : " + childData.getName(), Toast.LENGTH_SHORT).show(); } }); } @Override public void onBindGroupViewHolder(ParentViewHolder holder, int flatPosition, ExpandableGroup group) { holder.setGroupName(group); } } |
In this Example of Create Expandable recyclerView. in this recyclerView create two layout file parent and child. and then different different view holder in this layout file. i have create getter setter data in different different class in parent view and child view.and then create Expandable adapter class in implements library.
now this adapter to different different method override in parent and child view. in this two layout file bind in adapter and then set the list data and send the list in adapter. now you can click parent view to dispaly child view and i have put the arrow drawable to click listener to set and maintain drawable icon you can click collapse and expand.