Kotlin Recyclerview Example with onclick on adapter row button to display info

 Lets learn building a RecyclerView using Kotlin in this Kotlin RecyclerView Example. I will show you how to add dummy data into recyclerview & display info in toast on adapter row button click.

Kotlin RecyclerView Example Video

• You can also go through this video explanation.

Kotlin RecyclerView Example

Creating a New Project

• So first create a new Android Studio project using Kotlin.
• Once the project is loaded come inside the activity_main.xml and remove the Hello World TextView.

Android studio project screen

Step 1:

Open build.gradle and add following dependency and rebuild the project.

implementation 'com.google.android.material:material:1.2.0'
implementation 'androidx.recyclerview:recyclerview:1.1.0'
implementation 'androidx.cardview:cardview:1.0.0'

Step 2:
user_row.xml
Add following code into user_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.cardview.widget.CardView
        android:layout_margin="10dp"
        app:cardCornerRadius="5dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:orientation="vertical">

            <TextView
                android:id="@+id/txt_user_name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text=""
                android:textSize="20dp"  />

            <TextView
                android:id="@+id/txt_user_email_id"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text=""
                android:textSize="17dp"  />

            <TextView
                android:id="@+id/txt_user_address"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text=""
                android:textSize="17dp"  />

            <Button
                android:id="@+id/btn_clcik"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Click To Display Info"
                android:textAllCaps="false"/>

        </LinearLayout>
    </androidx.cardview.widget.CardView>
</LinearLayout>
Step 3:
UserModel.kt
Add following code into UserModel.kt
package com.kotlinkatta.recyclerviewexample

data class UserModel(val name: String, val email_id: String,val address: String) {
}
Step 4:
UserAdapter.kt
Add following code into UserAdapter.kt
package com.kotlinkatta.recyclerviewexample

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Toast
import androidx.recyclerview.widget.RecyclerView
import kotlinx.android.synthetic.main.user_row.view.*

class UserAdapter (val userList: ArrayList<UserModel>) : RecyclerView.Adapter<UserAdapter.ViewHolder>() {

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

    override fun onBindViewHolder(holder: UserAdapter.ViewHolder, position: Int) {
        val usermodel : UserModel = userList[position]
        holder.txt_user_name.text = "Name :" + usermodel.name
        holder.txt_user_email_id.text = "Email Id : " + usermodel.email_id
        holder.txt_user_address.text = "Address : " + usermodel.address
        holder.btn_clcik.setOnClickListener {
            Toast.makeText(holder.itemView.context,"Name : "+usermodel.name + "\nEmail Id : "+usermodel.email_id + "\nAddress : "+usermodel.address,Toast.LENGTH_SHORT).show()
        }
    }

    override fun getItemCount(): Int {
        return userList.size
    }

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
         val txt_user_name = itemView.txt_user_name
         val txt_user_email_id = itemView.txt_user_email_id
         val txt_user_address = itemView.txt_user_address
         val btn_clcik = itemView.btn_clcik
    }
}
Step 5:
activity_main.xml
Add following code into activity_main.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="match_parent"
    tools:context=".MainActivity">

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

    </androidx.recyclerview.widget.RecyclerView>

</androidx.constraintlayout.widget.ConstraintLayout>
Step 6:
MainActivity.kt
Add following code into MainActivity.kt
package com.kotlinkatta.recyclerviewexample

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView
import kotlinx.android.synthetic.main.activity_main.*

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

        val users_list = ArrayList<UserModel>()

        //adding some dummy data to the list
        users_list.add(UserModel("Akbar Desai", "akbardesai123@gmail.com","S-6, xtz, Naupada, Thane (west)"))
        users_list.add(UserModel("Ramesh Desai", "rameshdesai123@hmail.com","abc, Bangalore-560016"))
        users_list.add(UserModel("Kunal Desai", "kunaldesai123@hmail.com"," tcd, nagar, Naupada, Thane (east)"))
        users_list.add(UserModel("Sahil Desai", "sahildesai123@hmail.com"," xtc, mata, kalwa (west)"))
        users_list.add(UserModel("Rupesh Desai", "rupeshdesai123@hmail.com"," sdr, rameshwadi, Thane (west)"))

        val recyclerView = findViewById(R.id.recyclerview) as RecyclerView
        var layoutManager = LinearLayoutManager(this)
        recyclerview.layoutManager = layoutManager
        val adapter = UserAdapter(users_list)
        recyclerView.adapter = adapter
    }
}
Output: