RecyclerView
Android Development
UI Design
Programming
App Development

How to add dividers and spaces between items in RecyclerView

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

In Android, spacing and dividers in a RecyclerView are usually implemented with ItemDecoration. That is the right extension point because it lets you add offsets and drawing behavior without cluttering the adapter or hard-coding margins into every item layout.

Use ItemDecoration for Spacing

If you want even spacing between list items, create a custom ItemDecoration and override getItemOffsets. Here is a simple vertical spacing decoration in Kotlin:

kotlin
1import android.graphics.Rect
2import android.view.View
3import androidx.recyclerview.widget.RecyclerView
4
5class VerticalSpaceDecoration(
6    private val spacePx: Int
7) : RecyclerView.ItemDecoration() {
8
9    override fun getItemOffsets(
10        outRect: Rect,
11        view: View,
12        parent: RecyclerView,
13        state: RecyclerView.State
14    ) {
15        val position = parent.getChildAdapterPosition(view)
16        if (position == RecyclerView.NO_POSITION) return
17
18        outRect.bottom = spacePx
19        if (position == 0) {
20            outRect.top = spacePx
21        }
22    }
23}

Attach it like this:

kotlin
val spacing = resources.getDimensionPixelSize(R.dimen.list_spacing)
recyclerView.addItemDecoration(VerticalSpaceDecoration(spacing))

This keeps the adapter focused on data binding rather than visual polish.

Use DividerItemDecoration for Standard Lines

If you just need a normal divider between rows in a vertical list, Android already provides DividerItemDecoration:

kotlin
1import androidx.recyclerview.widget.DividerItemDecoration
2import androidx.recyclerview.widget.LinearLayoutManager
3
4recyclerView.layoutManager = LinearLayoutManager(this)
5
6val divider = DividerItemDecoration(
7    recyclerView.context,
8    DividerItemDecoration.VERTICAL
9)
10recyclerView.addItemDecoration(divider)

This is the fastest solution when the built-in line style is good enough for the screen.

Drawing a Custom Divider

When you need a specific color, thickness, or inset, write your own decoration and draw the divider yourself:

kotlin
1import android.graphics.Canvas
2import android.graphics.Paint
3import androidx.recyclerview.widget.RecyclerView
4
5class SimpleLineDivider(
6    color: Int,
7    private val heightPx: Float
8) : RecyclerView.ItemDecoration() {
9
10    private val paint = Paint().apply {
11        this.color = color
12        style = Paint.Style.FILL
13    }
14
15    override fun onDraw(c: Canvas, parent: RecyclerView, state: RecyclerView.State) {
16        val left = parent.paddingLeft.toFloat()
17        val right = (parent.width - parent.paddingRight).toFloat()
18
19        for (i in 0 until parent.childCount) {
20            val child = parent.getChildAt(i)
21            val y = child.bottom.toFloat()
22            c.drawRect(left, y, right, y + heightPx, paint)
23        }
24    }
25}

Then register it:

kotlin
recyclerView.addItemDecoration(SimpleLineDivider(0xFFBBBBBB.toInt(), 2f))

That gives you exact control without editing every row XML.

Spacing in a Grid Layout

Grids need more care because left and right spacing must be balanced across columns. A list-style spacing class usually produces uneven gaps in a GridLayoutManager.

A common grid decoration looks like this:

kotlin
1class GridSpacingDecoration(
2    private val spanCount: Int,
3    private val spacing: Int
4) : RecyclerView.ItemDecoration() {
5
6    override fun getItemOffsets(
7        outRect: Rect,
8        view: View,
9        parent: RecyclerView,
10        state: RecyclerView.State
11    ) {
12        val position = parent.getChildAdapterPosition(view)
13        if (position == RecyclerView.NO_POSITION) return
14
15        val column = position % spanCount
16        outRect.left = spacing * column / spanCount
17        outRect.right = spacing - (spacing * (column + 1) / spanCount)
18        outRect.bottom = spacing
19        if (position < spanCount) outRect.top = spacing
20    }
21}

The offset math avoids double-width gaps between neighboring columns.

Why Decorations Are Better Than Item Margins

Margins inside the item layout can work for simple lists, but decorations are easier to centralize and reuse. They also let the same row layout appear in different screens with different spacing rules.

That separation matters in large apps, where UI spacing should be adjusted at the list level rather than copied into many XML files.

Common Pitfalls

The biggest mistake is double spacing. If every item gets both top and bottom padding, the gap between two rows becomes larger than intended. Usually you apply one side consistently and add the opposite side only for the first item or first row.

Another pitfall is assuming DividerItemDecoration solves grid spacing. It is mainly useful for linear layouts and does not automatically create balanced spacing across columns.

Developers also sometimes mix item margins and decorations, then wonder why the list looks too loose. Pick one spacing strategy unless you intentionally want both.

Finally, complex drawing logic in onDraw can hurt scroll performance. Decorations should stay lightweight.

Summary

  • Use ItemDecoration to add spacing and dividers to RecyclerView cleanly.
  • 'DividerItemDecoration is the simplest choice for standard linear lists.'
  • Custom decorations are best when you need exact spacing, inset, or color rules.
  • Grid layouts need column-aware offset calculations to stay visually balanced.
  • Avoid mixing margins and decorations unless the combined effect is deliberate.

Course illustration
Course illustration

All Rights Reserved.