Android RecyclerView in Kotlin (original) (raw)

Last Updated : 23 Jul, 2025

In this article, you will know how to implement RecyclerView in Android using Kotlin . Before moving further let us know about RecyclerView. A RecyclerView is an advanced version of ListView with improved performance. When you have a long list of items to show you can use RecyclerView. It has the ability to reuse its views. In RecyclerView when the View goes out of the screen or not visible to the user it won't destroy it, it will reuse these views. This feature helps in reducing power consumption and providing more responsiveness to the application. Now let's see how to implement RecyclerView using Kotlin.

Step-by-Step Implementation

**Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.

**Step 2: Go to activity_main.xml and add the following code

Add RecyclerView to **activity_main.xml you can add it from the drag and drop from the design section or you can add it manually by writing some initial characters of RecyclerView then the IDE will give you suggestions for RecyclerView then select RecyclerView it will automatically add it to your layout file.

**activity_main.xml:

XML `

<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:id="@+id/main" 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"
    tools:listitem="@layout/card_view_design"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

`

**Design UI:

**Step 3: Create a New Layout Resource File

Now create a new Layout Resource File which will be used to design our CardView layout. Go to **app > res > layout > [right-click] > New > Layout Resource File and name that file as **card_view_design and add the code provided below. In this file, you can design the layout to show it into the RecyclerView.

**card_view_design.xml:

XML `

<com.google.android.material.card.MaterialCardView 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_margin="16dp">

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="8dp">

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"
        android:src="@drawable/gfg_logo"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="32dp"
        android:text="Item"
        android:textSize="20sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@+id/imageview"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toEndOf="@+id/imageview"
        app:layout_constraintTop_toTopOf="@+id/imageview" />

</androidx.constraintlayout.widget.ConstraintLayout>

</com.google.android.material.card.MaterialCardView>

`

**Design UI:

**Step 4: Create a new Kotlin class

Go to app > java > {package name} > [right-click] > New > Kotlin class/file and choose Data class from the list. Name that file as **Item and then click on OK. This file will hold the information of every item which you want to show in your RecyclerView.

**Item.kt:

Kotlin `

package org.geeksforgeeks.demo

data class Item( val image: Int, val text: String )

`

**Step 5: Create Adapter Class

Go to app > java > {package-name} > [right-click] > New > Kotlin class/file and name that file as **Adapter and then click on OK. After this add the code provided below. Comments are added inside the code to understand the code in more detail.

This class contains some important functions to work with the RecyclerView these are as follows:

• **onCreateViewHolder(): This function sets the views to display the items.
• **onBindViewHolder(): This function is used to bind the list items to our widgets such as TextView, ImageView, etc.
• **getItemCount(): It returns the count of items present in the list.

**Adapter.kt:

Kotlin `

package org.geeksforgeeks.demo

import android.view.LayoutInflater import android.view.View import android.view.ViewGroup import android.widget.ImageView import android.widget.TextView import androidx.recyclerview.widget.RecyclerView

class Adapter(private val list: List) : RecyclerView.Adapter<Adapter.ViewHolder>() {

// create new views
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
    // inflates the card_view_design view
    // that is used to hold list item
    val view = LayoutInflater.from(parent.context)
        .inflate(R.layout.card_view_design, parent, false)

    return ViewHolder(view)
}

// binds the list items to a view
override fun onBindViewHolder(holder: ViewHolder, position: Int) {

    val item = list[position]

    // sets the image to the imageview from our itemHolder class
    holder.imageView.setImageResource(item.image)

    // sets the text to the textview from our itemHolder class
    holder.textView.text = item.text

}

// return the number of the items in the list
override fun getItemCount(): Int {
    return list.size
}

// Holds the views for adding it to image and text
class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
    val imageView: ImageView = itemView.findViewById(R.id.imageview)
    val textView: TextView = itemView.findViewById(R.id.textView)
}

}

`

**Step 6: Working with the MainActivity.kt

Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.

**MainActivity.kt:

Kotlin `

package org.geeksforgeeks.demo

import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import androidx.recyclerview.widget.LinearLayoutManager import androidx.recyclerview.widget.RecyclerView

class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    // getting the recyclerview by its id
    val recyclerview: RecyclerView = findViewById(R.id.recyclerview)

    // this creates a vertical layout Manager
    recyclerview.layoutManager = LinearLayoutManager(this)

    // ArrayList of class ItemsViewModel
    val data = ArrayList<Item>()

    // This loop will create 20 Views containing
    // the image with the count of view
    for (i in 1..20) {
        data.add(Item(R.drawable.gfg_logo, "Item $i"))
    }

    // This will pass the ArrayList to our Adapter
    val adapter = Adapter(data)

    // Setting the Adapter with the recyclerview
    recyclerview.adapter = adapter
}

}

`

Output: