Kotlin RecyclerView with Click Listener

Create a RecyclerView in Android with Kotlin – A Step-by-Step Guide

In today’s tutorial we’ll learn how to create a RecyclerView in Kotlin for Android with items that are clickable. This approach, distinct from the traditional ListView, offers a more dynamic and flexible way to display a scrollable list. Read on to discover how to implement clickable items within a RecyclerView.

Summary:

• activity_main.xml
• list_item.xml
• Person.kt
• MyCustomAdapter.kt
• MainActivity.kt

Understanding RecyclerView and Its Advantages

RecyclerView in Android is a versatile and powerful component, hence it’s essential for displaying lists of data, offering better performance and flexibility compared to its predecessor, ListView. With RecyclerView, developers can create dynamic, responsive list layouts that improve app efficiency and user experience.

Prerequisites:

• kotlin_version = ‘1.9.0’

app/build.gradle

dependencies {

    implementation "androidx.core:core-ktx:1.12.0"
    implementation "androidx.appcompat:appcompat:1.6.1"
    implementation "com.google.android.material:1.12.0-beta01"
    implementation "androidx.constraintlayout:constraintlayout:2.1.4"
    implementation "androidx.recyclerview:recyclerview:1.3.2"
    testImplementation "junit:junit:4.13.2"
}

As can be seen, in this post we will write in Kotlin a very simple example for RecylcerView with a click listener that is applied directly on the item’s view.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/my_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

list_item.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_item"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:background="?selectableItemBackground"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/list_item_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="5dp"
        android:padding="10dp"
        android:textSize="20sp" />
</androidx.appcompat.widget.LinearLayoutCompat>

Person.kt

data class Person(val name: String)

MyCustomAdapter.kt

package com.example.kotlinrecyclerview

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

class MyCustomAdapter(
    private val items: List<Person>,
    private val clickListener: (Person) -> Unit
) : RecyclerView.Adapter<MyCustomAdapter.ViewHolder>() {
    override fun getItemCount(): Int {
        return items.size
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.list_item, parent, false)
        return ViewHolder(view, clickListener)
    }

    override fun onBindViewHolder(viewHolder: ViewHolder, position: Int) {
        viewHolder.bind(items[position])
    }

    class ViewHolder(view: View, onClick: (Person) -> Unit) : RecyclerView.ViewHolder(view) {
        private val nameTextView: TextView = view.findViewById(R.id.list_item_text_view)
        private var currentPerson: Person? = null

        init {
            view.setOnClickListener {
                currentPerson?.let { onClick(it) }
            }
        }

        fun bind(person: Person) {
            currentPerson = person
            nameTextView.text = person.name
        }
    }
}

MainActivity.kt

package com.example.kotlinrecyclerview

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
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)

        val person1 = Person("Diana1")
        val person2 = Person("Diana2")
        val person3 = Person("Diana3")
        val person4 = Person("Diana4")
        val person5 = Person("Diana5")
        val person6 = Person("Diana6")
        val person7 = Person("Diana7")
        val person8 = Person("Diana8")
        val persons = listOf(person1, person2, person3, person4, person5, person6, person7, person8)

        val recyclerView: RecyclerView = findViewById(R.id.my_recycler_view)
        recyclerView.layoutManager = LinearLayoutManager(this)
        recyclerView.setHasFixedSize(true)
        recyclerView.adapter = MyCustomAdapter(persons) { person ->
            personItemClicked(person)
        }
    }

    private fun personItemClicked(person: Person) {
        Toast.makeText(this, "Clicked: ${person.name}", Toast.LENGTH_SHORT).show()
    }
}

This tutorial is perfect for beginners who want to have a quick try of how to create a RecyclerView in Android with a clickListener on for each item in the list. But of course, you can adapt this code according to your needs and project architecture.

You can read more on Android Developers page here.

Stay tuned!

Other posts related to RecyclerView which you might find to be useful here: