Android Tutorial

Software Setup and Configuration

Android Studio

File Structure

Components

Core Topics

Layout

View

Button

Intent and Intent Filters

Toast

RecyclerView

Fragments

Adapters

Other UI Component

Image Loading Libraries

Date and Time

Material Design

Bars

Working with Google Maps

Chart

Animation

Database

Advance Android

Jetpack

Architecture

App Publish

App Monetization

Android Horizontal RecyclerView with Examples

A RecyclerView is a flexible and advanced version of the traditional ListView and GridView. With the right configuration and layout manager, you can make RecyclerView display items in a horizontal manner.

Below is a simple example to demonstrate a horizontal RecyclerView.

1. Setting up Dependencies

First, ensure you have the necessary dependencies added in your app's build.gradle:

implementation 'androidx.recyclerview:recyclerview:7.0.0' // Ensure you have the latest version

2. Create a layout for individual items

Let's say we're creating a horizontal list of text items. Create a layout file item_horizontal.xml:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tvItem"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="16dp"
    android:background="@color/design_default_color_primary"
    android:textColor="#FFFFFF"/>

3. Create the RecyclerView Adapter

class HorizontalAdapter(private val items: List<String>) : RecyclerView.Adapter<HorizontalAdapter.ViewHolder>() {

    class ViewHolder(itemView: TextView) : RecyclerView.ViewHolder(itemView) {
        val tvItem: TextView = itemView.findViewById(R.id.tvItem)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.item_horizontal, parent, false) as TextView
        return ViewHolder(view)
    }

    override fun getItemCount(): Int = items.size

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

4. Create and Set up the RecyclerView in your Activity or Fragment

In your activity's or fragment's XML file (activity_main.xml for instance):

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/horizontalRecyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_gravity="center"/>

In your activity or fragment:

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView

class MainActivity : AppCompatActivity() {

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

        val items = listOf("Item 1", "Item 2", "Item 3", "Item 4", "Item 5")

        val horizontalRecyclerView: RecyclerView = findViewById(R.id.horizontalRecyclerView)
        horizontalRecyclerView.layoutManager = LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false)
        horizontalRecyclerView.adapter = HorizontalAdapter(items)
    }
}

The key line here is setting the LayoutManager to LinearLayoutManager.HORIZONTAL which tells the RecyclerView to layout items horizontally.

Now when you run your app, you'll see items displayed in a horizontal list. You can scroll horizontally if there are more items than can fit on the screen. This is a simple example, but RecyclerView is highly customizable and can support much more complex use-cases with different types of view holders, animations, and so on.

  1. Horizontal RecyclerView example code in Kotlin:

    Set up a horizontal RecyclerView in your layout:

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

    In Kotlin:

    val horizontalRecyclerView = findViewById<RecyclerView>(R.id.horizontalRecyclerView)
    horizontalRecyclerView.layoutManager = LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false)
    horizontalRecyclerView.adapter = MyHorizontalAdapter(data)
    
  2. Creating a horizontal scrollable list in Android:

    Set the orientation of the RecyclerView to horizontal:

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/horizontalRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"/>
    
  3. Customizing item layout in Horizontal RecyclerView:

    Customize the layout for each item in your adapter:

    // Inside onCreateViewHolder in your adapter
    val view = LayoutInflater.from(parent.context).inflate(R.layout.horizontal_item_layout, parent, false)
    return MyViewHolder(view)
    
  4. Handling item clicks in Horizontal RecyclerView:

    Implement item click handling in your adapter:

    // Inside onBindViewHolder in your adapter
    holder.itemView.setOnClickListener {
        // Handle item click
    }
    
  5. Adding dividers to Horizontal RecyclerView in Android:

    Set dividers between items using DividerItemDecoration:

    val horizontalRecyclerView = findViewById<RecyclerView>(R.id.horizontalRecyclerView)
    val dividerItemDecoration = DividerItemDecoration(this, LinearLayoutManager.HORIZONTAL)
    horizontalRecyclerView.addItemDecoration(dividerItemDecoration)
    
  6. Implementing horizontal grid layout in RecyclerView:

    Use a GridLayoutManager with horizontal orientation:

    horizontalRecyclerView.layoutManager = GridLayoutManager(this, spanCount, LinearLayoutManager.HORIZONTAL, false)
    
  7. Endless scrolling in Horizontal RecyclerView Android:

    Implement endless scrolling by detecting when the user reaches the end and loading more data:

    horizontalRecyclerView.addOnScrollListener(object : RecyclerView.OnScrollListener() {
        override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
            if (!recyclerView.canScrollHorizontally(1)) {
                // Load more data
            }
        }
    })
    
  8. SnapHelper for smooth scrolling in Horizontal RecyclerView:

    Use SnapHelper for smooth item snapping:

    val snapHelper = LinearSnapHelper()
    snapHelper.attachToRecyclerView(horizontalRecyclerView)
    

    This enables snapping to the nearest item, creating a smoother scrolling experience.