Kotlin RecyclerView Example

Lets learn building a RecyclerView using Kotlin in this Kotlin RecyclerView Example. Learning the small things will help you to migrate to Kotlin. And yes Kotlin will be surely easy and fun once you’ll get used to it. So lets see this Kotlin RecyclerView Example.

Kotlin RecyclerView Example Video

You can also go through this video explanation.

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.

Adding RecyclerView

Now search for RecyclerView and drag it to your activity_main.xml (See the image for help).

When you will drag RecyclerView it will ask you to add the RecyclerView dependency.

So the xml code for our activity_main.xml will be.

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.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="net.simplifiedcoding.recyclerviewexample.MainActivity">

<android.support.v7.widget.RecyclerView

android:id="@+id/recyclerView"

android:layout_width="0dp"

android:layout_height="0dp"

tools:layout_editor_absoluteX="8dp"

tools:layout_editor_absoluteY="8dp"

android:layout_marginTop="8dp"

android:layout_marginBottom="8dp"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintBottom_toBottomOf="parent"

android:layout_marginStart="8dp"

android:layout_marginEnd="8dp" />

</android.support.constraint.ConstraintLayout>

Creating List Layout using CardView

Now for the list items we will create a new layout. So create a new layout resource file and name it list_layout.xml.
Now again to the same search CardView and drag it to the layout you just created. It will again ask you to add CardView dependency.

Now for the layout use the following xml code. Here I am going to display name and address only. But you can also design anything you want for your list.

<?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"

android:orientation="vertical">

<android.support.v7.widget.CardView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_margin="5dp">

<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

<TextView

android:id="@+id/textViewUsername"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:padding="5dp"

android:text="Belal Khan"

android:textAppearance="@style/Base.TextAppearance.AppCompat.Large" />

<TextView

android:id="@+id/textViewAddress"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:padding="5dp"

android:text="Ranchi, Jharkhand"

android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium" />

</LinearLayout>

</android.support.v7.widget.CardView>

</LinearLayout>

Now thats it for the List Layout. The above xml code will generate the following layout.

Now lets create data class for list model.

Creating Model

The list is about user so we will create a User class.
Create a new Kotlin file and write the following code.

package net.simplifiedcoding.recyclerviewexample

/**

* Created by Belal on 6/19/2017.

data class User(val name: String, val address: String)

Now lets build the Adapter.

Creating RecyclerView Adapter

If you have already created a RecyclerView in java, then you may already know that we need an Adapter to display the data in RecyclerView.
So create a new Kotlin class named CustomAdapter.kt and write the following code.

package net.simplifiedcoding.recyclerviewexample

import android.support.v7.widget.RecyclerView

import android.view.LayoutInflater

import android.view.View

import android.view.ViewGroup

import android.widget.TextView

/**

* Created by Belal on 6/19/2017.

class CustomAdapter(val userList: ArrayList<User>) : RecyclerView.Adapter<CustomAdapter.ViewHolder>() {

//this method is returning the view for each item in the list

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): CustomAdapter.ViewHolder {

val v = LayoutInflater.from(parent.context).inflate(R.layout.list_layout, parent, false)

return ViewHolder(v)

}

//this method is binding the data on the list

override fun onBindViewHolder(holder: CustomAdapter.ViewHolder, position: Int) {

holder.bindItems(userList[position])

}

//this method is giving the size of the list

override fun getItemCount(): Int {

return userList.size

}

//the class is hodling the list view

class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {

fun bindItems(user: User) {

val textViewName = itemView.findViewById(R.id.textViewUsername) as TextView

val textViewAddress = itemView.findViewById(R.id.textViewAddress) as TextView

textViewName.text = user.name

textViewAddress.text = user.address

}

Now the last step is creating the RecyclerView itself.

Creating RecyclerView

Now come to MainActivity.kt and write the following code.

package net.simplifiedcoding.recyclerviewexample

import android.support.v7.app.AppCompatActivity

import android.os.Bundle

import android.support.v7.widget.LinearLayoutManager

import android.support.v7.widget.RecyclerView

import android.widget.LinearLayout

class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {

super.onCreate(savedInstanceState)

setContentView(R.layout.activity_main)

//getting recyclerview from xml

val recyclerView = findViewById(R.id.recyclerView) as RecyclerView

//adding a layoutmanager

recyclerView.layoutManager = LinearLayoutManager(this, LinearLayout.VERTICAL, false)

//crating an arraylist to store users using the data class user

val users = ArrayList<User>()

//adding some dummy data to the list

users.add(User("Belal Khan", "Ranchi Jharkhand"))

users.add(User("Ramiz Khan", "Ranchi Jharkhand"))

users.add(User("Faiz Khan", "Ranchi Jharkhand"))

users.add(User("Yashar Khan", "Ranchi Jharkhand"))

//creating our adapter

val adapter = CustomAdapter(users)

//now adding the adapter to recyclerview

recyclerView.adapter = adapter

}

Now thats it for the coding. Lets try running the application.

As you can see it is working absolutely fine.

So thats all for this Kotlin RecyclerView Example friends. If you are having any confusions and queries then lets discuss it on the comment section. And I will keep posting more tutorials using Android Development with Kotlin as well. And for your side I want you to SHARE this post if you think it is useful. Thank You 🙂