Android RecyclerView with GridLayoutManager

Here is an example of displaying a list of items in grids with 2 columns and N rows depending on the size of the list.

Dependencies

implementation 'com.android.support:appcompat-v7:26.1.0'
implementation 'com.android.support.constraint:constraint-layout:1.0.2'
implementation 'com.android.support:cardview-v7:26.1.0'
implementation 'com.android.support:recyclerview-v7:26.1.0'

MainActivity.kl, the important line below that makes the list a grid list is val gridLayoutManager = GridLayoutManager(this,2), where 2 means make it two columns.

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.support.v7.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 topics = listOf("Education","Finance","Government","Entertainment","Technology","Math","Biology","Physics","Chemistry","Space","Sports","Music","Animal","Countries","Weather","Politics","Traffic","Poverty","Social Media","Internet","Housing")
        val gridLayoutManager = GridLayoutManager(this,2)
        val gridListAdapter = GridListAdapter(topics)

        recycler_view.setHasFixedSize(true)
        recycler_view.layoutManager = gridLayoutManager
        recycler_view.adapter = gridListAdapter
    }
}

list_item.xml, the layout file for each grid. It’s a simple CardView with only one text view inside it.



    

activity_main.xml, the main screen layout file hosting the RecyclerView for displaying a list of items.




    


GridListAdapter.kl, the grid list adapter, it’s the same as a normal recyclerview adapter for vertical or horizontal list.

import android.support.v7.widget.RecyclerView
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import android.widget.Toast

class GridListAdapter(private val itemList: List) : RecyclerView.Adapter() {

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

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.tvTopic.text = itemList[position]
    }

    override fun getItemCount() = itemList.size

    inner class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView), View.OnClickListener {
        var tvTopic: TextView

        init {
            itemView.setOnClickListener(this)
            tvTopic = itemView.findViewById(R.id.topic) as TextView
        }

        override fun onClick(view: View) {
            Toast.makeText(view.context,
                    "Clicked Position = " + adapterPosition, Toast.LENGTH_SHORT)
                    .show()
        }
    }
}

Complete example in Github

Search within Codexpedia

Custom Search

Search the entire web

Custom Search