Expandable RecyclerView
Expandable RecyclerView is one of the most important feature in Android which can be easily created for our application .
It contains two views one is parent view and other is child view. Parent is visible by default but the child view has to be expanded and collapsed. It will expand when we click on parent view.
Expandable RecyclerView View Holders
We have to create two view holders to hold the view of parent and child
- ParentViewHolder
- ChildViewHolder.
So, by using these we shall create it in our application to make it better.
build.gradle:
Add this dependency in your build.gradle file.
|
1 2 |
implementation 'com.android.support:recyclerview-v7:25.3.1' implementation 'com.android.support:cardview-v7:27.0.2' |
Data Model
- Now to store data, we need to create a model class. So create a new class named Person.java and write the following code.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
package com.example.exprv; public class Person { private String fName, lastName; public Person(String fName , String lastName ) { this.fName = fName; this.lastName=lastName; } public String getfName() { return fName; } public String getLastName() { return lastName; } } |
Adding RecyclerView
- Now come back to the layout of your MainActivity which is usually activity_main.xml and add a RecyclerView here.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?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" tools:context=".MainActivity"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/recyclerView" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout> |
Designing List Layout
- Now lets design the xml layout for the List. So first create a new layout resource file named list_layout_persons.xml (or you can give it any name), and write the following xml 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 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 |
<?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:orientation="vertical"> <androidx.cardview.widget.CardView android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView android:id="@+id/textViewName" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#ff3847" android:padding="10dp" android:text="Iron Man" android:textAlignment="center" android:textAppearance="@style/Base.TextAppearance.AppCompat.Large.Inverse" /> <LinearLayout android:animateLayoutChanges="true" android:id="@+id/linearLayout" android:visibility="gone" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="15dp"> <TableRow> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="First Name " /> <TextView android:id="@+id/textViewFirstName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Tony Stark" android:textStyle="bold" /> </TableRow> <TableRow> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Last Name " /> <TextView android:id="@+id/textViewLastName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="yadav" android:textStyle="bold" /> </TableRow> </TableLayout> </LinearLayout> </LinearLayout> </androidx.cardview.widget.CardView> </RelativeLayout> |
Creating RecyclerView Adapter
- Create a new class named PersonAdapter.java and write the following 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 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 |
package com.example.exprv; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; import android.widget.Toast; import androidx.recyclerview.widget.RecyclerView; import java.util.List; /** * Created by Belal on 7/15/2017. */ public class PersonAdapter extends RecyclerView.Adapter<PersonAdapter.PersonViewHolder> { private List<Person> personList; private Context context; private static int currentPosition = 0; public PersonAdapter(List<Person> personList, Context context) { this.personList = personList; this.context = context; } @Override public PersonViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_layout_persons, parent, false); return new PersonViewHolder(v); } @Override public void onBindViewHolder(finalPersonViewHolder holder, final int position) { Person person = personList.get(position); holder.textViewFirstName.setText(person.getfName()); holder.textViewLastName.setText(person.getLastName()); holder.linearLayout.setVisibility(View.GONE); //if the position is equals to the item position which is to be expanded if (currentPosition == position) { //toggling visibility holder.linearLayout.setVisibility(View.VISIBLE); } holder.textViewName.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { //getting the position of the item to expand it currentPosition = position; //reloding the list notifyDataSetChanged(); } }); } @Override public int getItemCount() { return personList.size(); } class PersonViewHolder extends RecyclerView.ViewHolder { TextView textViewFirstName, textViewLastName,textViewName; LinearLayout linearLayout; PersonViewHolder(View itemView) { super(itemView); textViewName = (TextView) itemView.findViewById(R.id.textViewName); textViewFirstName = (TextView) itemView.findViewById(R.id.textViewFirstName); textViewLastName = (TextView) itemView.findViewById(R.id.textViewLastName); linearLayout = (LinearLayout) itemView.findViewById(R.id.linearLayout); } } } |
- Now come back to MainActivity.java and write the following code.
. . .
Be the first to comment.