How to make a simple RecyclerView in Android Studio

Published in

Developer Community SASTRA

5 min readMar 13, 2022

In this blog, I’m going to explain how to make a RecyclerView in Java. It is used to display thousands of items as a list and is used in many Android applications like Playstore, Instagram, Facebook, etc.

In this image, you can see both Vertical and horizontal RecyclerView(Play store)

Why RecyclerView?

The Android platform gives us two different types of views that can be leveraged to display lists of data — the ListView and the RecyclerView.

RecyclerView makes it easier to display large sets of data. It creates data dynamically, when needed and requires very less memory than ScrollView. It only creates as many views as required to fill the layout whereas ScrollView gets all the data at a time and causes the screen to get less responsive over time. As the user scrolls down, the items at the top will get replaced by the forthcoming items.

Implementation of RecyclerView

Step 1: Create an Android project in Android Studio.

Note that Java is selected as the programming language.

Step 2: Create a layout file containing RecyclerView as an element in the layout. It displays the data of the items in a list.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0"
        tools:layout_editor_absoluteX="-27dp" />
</androidx.constraintlayout.widget.ConstraintLayout>

Step 3: Create a new layout file list_item.xml for a single list item view. This layout contains an ImageView and TextView.

The following is the code for the list_item.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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="wrap_content"
    android:layout_marginBottom="10dp"
    tools:context=".list_item">


    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/imageinfo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="192dp"
        android:text="TextView"
        android:textColor="@color/black"
        android:textSize="22sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.101"
        app:layout_constraintStart_toEndOf="@+id/image"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Step 4: Create an Adapter class that acts as a bridge between the data and layout elements.

Following is the code for the Adapter.java:

package com.example.recyclerview;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;

public class Adapter extends RecyclerView.Adapter<Adapter.ViewHolder>{
    ArrayList Img, Name;
    Context context;

    // Constructor for initialization
    public Adapter(Context context, ArrayList Img, ArrayList Name) {
        this.context = context;
        this.Img = Img;
        this.Name = Name;
    }
    @NonNull
    @Override
    public Adapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.activity_list_item, parent, false);

        // Passing view to ViewHolder
        Adapter.ViewHolder viewHolder = new Adapter.ViewHolder(view);
        return viewHolder;
    }
    @Override
    public void onBindViewHolder(@NonNull Adapter.ViewHolder holder, int position) {
        int res = (int) Img.get(position);
        holder.images.setImageResource(res);
        holder.text.setText(Name.get(position));
    }
    @Override
    public int getItemCount() {
        return Img.size();
    }
    public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView images;
        TextView text;

        public ViewHolder(View view) {
            super(view);
            images = itemView.findViewById(R.id.image);
            text = itemView.findViewById(R.id.imageinfo);
        }
    }
}

The following are the methods used in the above code:

OnCreateViewHolder: RecyclerView calls this method whenever it needs to create a new ViewHolder. It creates and initializes the ViewHolder and its associated View, but does not fill in the view's contents.
OnBindViewHolder: RecyclerView calls this method to associate a ViewHolder with data. The method fetches the appropriate data and uses the data to fill in the view holder's layout.
getItemCount: RecyclerView calls this method to get the size of the data set.

Step 5: In the MainActivity.java class, we create two ArrayList for storing Img and Name. Images are added to a drawable folder, then we get the reference RecyclerView and set the LayoutManager as LinearLayoutManager and Adapter to show items in RecyclerView.

Following is the code for the MainActivity.java file.

package com.example.recyclerview;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import android.os.Bundle;
import java.util.ArrayList;
import java.util.Arrays;

public class MainActivity extends AppCompatActivity {
    RecyclerView recyclerView;
    ArrayList Img = new ArrayList<>(Arrays.asList(R.drawable.apple, R.drawable.banana,
            R.drawable.orange, R.drawable.watermelon,
            R.drawable.jackfruit));
    ArrayList Name = new ArrayList<>(Arrays.asList("Apple", "Banana", "Orange", "Watermelon", "Jackfruit"));
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        recyclerView = findViewById(R.id.recyclerview);

        // layout for vertical orientation
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getApplicationContext());
        recyclerView.setLayoutManager(linearLayoutManager);

        // Sending reference and data to Adapter
        Adapter adapter = new Adapter(MainActivity.this, Img, Name);

        // Setting Adapter to RecyclerView
        recyclerView.setAdapter(adapter);

    }
}

A LayoutManager is responsible for measuring and positioning item views within a RecyclerView as well as determining the policy for when to recycle the item views that are no longer visible to the user.

The Android framework provides a few predefined layout managers that can be used to determine how the data would be displayed. The LayoutManagers are: