RecyclerView in android with kotlin

Hello guys, I hope you are doing well. And I think you were looking about the trick for integrating the RecyclerView in android with Kotlin. Android RecyclerView is an important component widely used in Android apps. It is important to know how to use it and how to customize its behavior. And for your kind information, I would like to tell you that, ListView is going to Replaced By Recycler View. Because if you see into your Design Window then you can find the Legacy Tab, After clicking on Legacy Tab you can find Listview is in Legacy. This means reducing the use of Listview and replacing it via Recycler View. And this officially announced in Android Summit December 2018. So without wasting more time let’s directly comes to the topic.

RecyclerView

If your app needs to display a scrolling list of elements based on large data sets (or data that frequently changes), you should use RecyclerView as described on this page. Basically, The Recycler View widget is a more advanced and flexible version of ListView.

Great! Now let’s move to the programming, At the very first import the following library for the Recycler View in android.

implementation 'com.google.android.material:material:1.1.0'

That’s cool after that create Recycler View in your activity or fragment wherever you have to use that. Which is as –

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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"
        tools:context=".MainActivity" />
</LinearLayout>

Great 👍 work. Now let’s create item.xml file inside your layout folder and add the following content to that. Which is given below –

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

    <LinearLayout
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_margin="10dp"
        android:background="#ececec"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:textColor="@android:color/white"
            android:textSize="30sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:textColor="@android:color/white"
            android:textSize="17sp"
            android:textStyle="normal" />
    </LinearLayout>

</LinearLayout>

Wonderful 😊😊 finally our work has been complete from the XML side. Now let’s create an AdapterClass.kt in kotlin programming language. Which would be given as below. 

import android.content.Context
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.core.content.ContextCompat
import androidx.recyclerview.widget.RecyclerView

class AdapterClass(val mContext: Context, val list: ArrayList<String>) :
    RecyclerView.Adapter<AdapterClass.Holder>() {

    class Holder internal constructor(view: View) : RecyclerView.ViewHolder(view) {
        val view = view.findViewById<View>(R.id.view)
        val title = view.findViewById<TextView>(R.id.title)
        val description = view.findViewById<TextView>(R.id.description)
    }

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

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

    override fun onBindViewHolder(holder: Holder, position: Int) {
        if (position % 2 == 0) {
            holder.view.setBackgroundColor(ContextCompat.getColor(mContext, R.color.colorAccent))
        } else {
            holder.view.setBackgroundColor(ContextCompat.getColor(mContext, R.color.colorPrimary))
        }

        holder.title.text = list[position]
    }
}

Great work, After that you have create GridLayoutManager and Adapter. And once you create both then just add to your recyclerview. Do like as given below.

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

class MainActivity : AppCompatActivity() {

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

        val list: ArrayList<String> = ArrayList()
        for (i in 0..10) {
            list.add("Title : " + (i + 1))
        }

        val manage = GridLayoutManager(this, 1, GridLayoutManager.VERTICAL, false)
        recyclerView.layoutManager = manage

        val adapter = AdapterClass(this, list)
        recyclerView.adapter = adapter
    }
}

Wonderful, In Conclusion, you have complete your goal. And the result would be as shown in the above screen. But if still you have any doubts about that then comment into the comment box or watch this video for more clarification.