Expandable RecyclerView Android – RecyclerView with Expandable Items

Hello guys, welcome to another useful post Expandable RecyclerView Android. In this post, we will build Expandable RecyclerView Items for our List. You might already know we use RecyclerView to display a List of data …

expandable recyclerview android

Hello guys, welcome to another useful post Expandable RecyclerView Android. In this post, we will build Expandable RecyclerView Items for our List. You might already know we use RecyclerView to display a List of data in our application. This time we will do the same we will create a RecyclerView, but the items of the RecyclerView will toggle on tapping. So initially some details of the list items will be hidden, and when we tap on the item it will show us the remaining detail by expanding itself. Sounds confusing? 😉 Don’t worry it is very easy. Let’s start.

The List Design

  • The first step is to decide the design of our List. So below you can see the design I have decided.
expandable recyclerview android
Expandable RecyclerView Android
  • I hope you got the basic idea of our Expandable RecyclerView from the image shown above. Now lets start creating our Android Project.

Expandable RecyclerView Android

Creating a New Project

  • As always we will create a new Android Studio project.
  • Here I have created a project named ExpandableRecyclerView using an empty activity.

Adding Dependencies

  • Here is my app level build.gradle file. You need to add these dependencies to your project as well.

  • I am using RecyclerView, CardView for building the List and Volley and Glide for network request and loading images from URL.

Web Service

  • We will fetch the data from the following web services. You can use the same or you can also create your own.

  • When you will go to the above URL you will see the following JSON data.

expandable recyclerview json data

Data Model

  • Now to store the above JSON data, we need to create a model class. So create a new class named Hero.java and write the following code.

Adding RecyclerView

  • Now come back to the layout of your MainActivity which is usually activity_main.xml and add a RecyclerView here.

Designing List Layout

  • Now let’s design the xml layout for the List. So first create a new layout resource file named list_layout_heroes.xml (or you can give it any name), and write the following xml code.

  • So thats it for the layout. The above xml code will display the following layout.
expandable recyclerview android list layout
List Layout
  • You can see only name is visible as the other thing will be visible after tapping the name. Now lets create an slide down animation effect and custom RecyclerView adapter.

Slide Down Animation

  • Inside the res folder create a new folder named anim. Inside this folder create a new anim resource file (basically a normal xml file) and write the following xml code.

Creating RecyclerView Adapter

  • Create a new class named HeroAdapter.java and write the following code.

  • The above RecyclerView adapter is same as we created the RecyclerView in previous tutorials. The only difference is we are toggling the visibility. I have added the comments where I am doing the toggling. Rest of the code is same.

Getting Data from Web Service and Loading it to RecyclerView

  • Now come back to MainActivity.java and write the following code.

  • Thats it now you can try running your application.
expandable recyclerview android
Expandable Recyclerview Android
  • Bingo! It is working fine. If you are in confusions, you can get the source code of this Expandable RecyclerView Android project from the link given below.

So that’s all for this Expandable RecyclerView Android tutorial. Hope you found it helpful. For any queries or feedback, you can leave your comments below. And I will soon post some more useful content for you. Thank You 🙂

Hi, my name is Belal Khan and I am a Google Developers Expert (GDE) for Android. The passion of teaching made me create this blog. If you are an Android Developer, or you are learning about Android Development, then I can help you a lot with Simplified Coding.

Expand Your Knowledge: Next Tutorial Picks

0 0 votes
Article Rating
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x