Kotlin - Recyclerview Example - Android Studio

on

 Lets learn building a RecyclerView using Kotlin in this Kotlin RecyclerView Example.

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:
RecyclerTouchListener.kt
Create new class RecyclerTouchListener.kt and Add following code into RecyclerTouchListener.kt

package com.kotlinkatta.recyclerviewexample
import android.content.Context
import android.view.GestureDetector
import android.view.GestureDetector.SimpleOnGestureListener
import android.view.MotionEvent
import android.view.View
import androidx.recyclerview.widget.RecyclerView
import androidx.recyclerview.widget.RecyclerView.OnItemTouchListener

class RecyclerTouchListener(context: Context?, recyclerView: RecyclerView?, private val clickListener: ClickListener?) : OnItemTouchListener {

    private val gestureDetector: GestureDetector

    interface ClickListener {
        fun onClick(view: View?, position: Int)
        fun onLongClick(view: View?, position: Int)
    }

    override fun onInterceptTouchEvent(rv: RecyclerView, e: MotionEvent): Boolean {
        val child = rv.findChildViewUnder(e.x, e.y)
        if (child != null && clickListener != null && gestureDetector.onTouchEvent(e)) {
            clickListener.onClick(child, rv.getChildAdapterPosition(child))
        }
        return false
    }

    override fun onTouchEvent(rv: RecyclerView, e: MotionEvent) {}
    override fun onRequestDisallowInterceptTouchEvent(disallowIntercept: Boolean) {}

    init {
        gestureDetector = GestureDetector(context, object : SimpleOnGestureListener() {

            override fun onSingleTapUp(e: MotionEvent?): Boolean {
                return true
            }

            override fun onLongPress(e: MotionEvent) {
                val child = recyclerView!!.findChildViewUnder(e.x, e.y)
                if (child != null && clickListener != null) {
                    clickListener.onLongClick(child, recyclerView.getChildAdapterPosition(child))
                }
            }
        })
    }
}
Step 3:
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"  />

        </LinearLayout>
    </androidx.cardview.widget.CardView>
</LinearLayout>
Step 4:
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 5:
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 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
    }

    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
    }
}
Step 6:
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 7:
MainActivity.kt
Add following code into MainActivity.kt
package com.kotlinkatta.recyclerviewexample

import android.content.Intent
import android.os.Bundle
import android.view.View
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

        // RecyclerView onClick & onLongClick
        recyclerView.addOnItemTouchListener(RecyclerTouchListener(applicationContext, recyclerView, object : RecyclerTouchListener.ClickListener {

            override fun onClick(view: View?, position: Int) {
                val recyle_sel: UserModel = users_list.get(position)

                val intent = Intent(applicationContext, WelcomeActivity::class.java)
                intent.putExtra("intent_name", recyle_sel.name)
                intent.putExtra("intent_email_id", recyle_sel.email_id)
                intent.putExtra("intent_address", recyle_sel.address)
                startActivity(intent)
            }

            override fun onLongClick(view: View?, position: Int) {
                val recyle_sel: UserModel = users_list.get(position)
            }
        }))
    }
}
Step 8:
WelcomeActivity.xml
Create new empty WelcomeActivity.kt and add following code into WelcomeActivity.kt
package com.kotlinkatta.recyclerviewexample

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView

class WelcomeActivity : AppCompatActivity() {
    var str_name = ""
    var str_email_id = ""
    var str_address = ""

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

        val i = intent
        val bd = i.extras
        if (bd != null) {
           str_name = bd.getString("intent_name")!!
           str_email_id = bd.getString("intent_email_id")!!
           str_address = bd.getString("intent_address")!!
        }

       val txt_name = findViewById(R.id.txt_name) as TextView
       val txt_address = findViewById(R.id.txt_address) as TextView
       val txt_email_id = findViewById(R.id.txt_email) as TextView

        txt_name.setText(str_name)
        txt_email_id.setText(str_email_id)
        txt_address.setText(str_address)
    }
}
Step 9:
activity_welcome.xml
Add following code into activity_welcome.xml.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=".WelcomeActivity">

    <LinearLayout
        android:layout_marginTop="50dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:id="@+id/txt_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="30dp"
            android:fontFamily="sans-serif-black"
            android:gravity="center" />

        <TextView
            android:id="@+id/txt_email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:fontFamily="sans-serif-black"
            android:gravity="center" />

        <TextView
            android:id="@+id/txt_address"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:fontFamily="sans-serif-black"
            android:gravity="center" />

    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Output:

Comments

Post a Comment