Loading...

Android RecyclerView Example

Android RecyclerView is used to create advance lists and cards or grids with material design concept in your android application. Android RecyclerView and CardView widgets can be used together. The RecyclerView is a advanced and flexible version of list view. By using RecyclerView and CardView widgets you can make more material design style app. If you want to add ListView or GridView inside NestedScrollView design support library, you may face many problems. So if you want to add lists, cards, grids with material header view, coordinator layout, I recommend you to use RecyclerView. You can customize your cards, lists in your own ways.

In this tutorial, you will learn to display grids item in your android application with image and text using android RecyclerView. For that you need to create java file like DataAdapter, AndroidVersion and ItemClickListener.

Related:
Android Material Design GridView Tutorial
Android Fragments Tutorial with Example
Start New Activity from Android ListView onItemClick

Android Example: Custom Grid RecyclerView with Images and Text


Let’s start by creating new android project called Android RecyclerView Example. After creating new project open build.gradle file and add compile com.android.support:recyclerview-v7:23.2.0 and compile com.android.support:design:23.0.0 dependencies. Bulid.gradle file will look like below.

build.gradle

Android Example: Custom Grid RecyclerView with Images and Text

XML Layout File

Open your main XML layout file and add android.support.v7.widget.RecyclerView inside android.support.design.widget.CoordinatorLayout with id. This will look like below.

res/layout/activity_main.xml

Now you need to create a new XML layout file for grids or lists item. Create row_layout.xml file in res/layout and add ImageView and TextView inside LinearLayout or RelativeLayout with different id. Following is the complete content of row_layout.xml file.

res/layout/row_layout.xml

Java Activity File

Open main java activity file and add following code. Here I have added text for grid title, images for grid items. Create ArrayList and add onItemTouchListener and onItemClickListener in recycler view. Following is the complete code of java activity file.

src/MainActivity.java

Again create a new java file called AndroidDataAdapter and extend into RecyclerView.Adapter<AndroidDataAdapter.ViewHolder>. Defile private variable from ArrayList and Context. In ViewHolder class you need to connect to grid row layout image and text like below. Following is the complete code of AndroidDataAdapter.java file.

src/AndroidDataAdapter.java


Again, create a new java file AndroidVersion.java and add following code.

src/ AndroidVersion.java


Handle RecyclerView Item Click Event

Finally, create a new java file called RecyclerItemClickListener.java to handle recycler item click listener and implements it to RecyclerView.OnItemTouchListener. Defile private variable to RecyclerView.OnItemTouchListener and add the following code. We have already added toast message when android recyclerView item click in mRecyclerView.addOnItemTouchListener of MainActivity.java file. Following is the complete java code of RecyclerItemClickListener.java file.

src/RecyclerItemClickListener.java

Run your Android RecyclerView Example application which will look like above screenshot. If you click grid items, a toast message will appear with grid position
Tutorial 7134819872156900755
Home item