Custom ItemDecoration

I had to build a custom item decorator and realised I hardly found answers on the web. So I’m writing this, hope it could help 😃

1. Simple ItemDecoration
2. Custom ItemDecoration
   1. ItemDecoration based on item position
   2. ItemDecoration without last item
   3. ItemDecoration base on item view type

1. Simple ItemDecoration : DividerItemDecoration

The main use case can be achieved using DividerItemDecoration provided by Android.

DividerItemDecoration(Context context, int orientation)

It creates a divider RecyclerView.ItemDecoration that can be used with a LinearLayoutManager.
@param context […] will be used to access resources.
@param orientation […] should be #HORIZONTAL or #VERTICAL.

What you need is to set the correct orientation, then provide a drawable used to split each item.

Simple DividerItemDecoration

Goods

• 4 lines of code
• Provided by Android
• Simple to use

Bads

• As named : limited usage to divide with space or line
• Limited to “infinity” scrolling use case : decoration will be drawn for each item, which means also the last one. Most of the time, we don’t want this.

2. Custom ItemDecoration

For better control and more advanced things we’ll extend RecyclerView.ItemDecoration.

3 methods are available :
- getItemOffsets used to determine spacing between items.
- onDraw used to decorate space between items.
- onDrawOver is same that onDraw but after item itself is drawn.

📖 See official doc : getItemOffsets, onDraw, onDrawOver

🔎 Please note following examples concern #Horizontal use cases. We can do same for #Vertical ones.

2.1. Decoration based on Item POSITION

Simple example to begin with: let’s decorate items on odd adapter position.

Custom ItemDecoration based on item View position

Main instruction here is parent.getChildAdapterPosition(view).

It Returns the adapter position that the given child view corresponds to. See complete doc.

⚠️ Not to be confused with the parent’s children positions (parent.children are items displayed on screen).

⚠️ Be careful not to miss RecyclerView.NO_POSITION case : getChildAdapterPosition could return -1.

2.2. Remove last item decoration

This is the most common use case you guys are asking on stackoverflow. It’s a special case of custom ItemDecoration based on items’ adapter position.

Custom DividerItemDecoration excluding last item decoration

Exclude last item if(childAdapterPosition == adapter.itemCount-1).

⚠️ parent.adapter is nullable

🔎 Note that in almost cases, you probably only need spacing between your items (last one excluded). No need to override onDraw method, setting the correct Rect size in getItemsOffsets method is enough.

Custom DividerItemDecoration excluding last item spacing decoration

2.3. Decoration based on item view Type

For this example we have 2 item types illustrated in black and grey. We decorate items with blue and red Drawables depending on item View type (declared in Adapter).

Custom ItemDecoration based on item View type

Main instruction here is adapter.getItemViewType(childAdapterPosition). We need to override getItemViewType method in our Adapter.

It returns the view type of the item at position for the purposes of view recycling.[…] Consider using id resources to uniquely identify item view types.

See getItemViewType official doc.

Once you’re able to identify your item View type, you can put the correct spacing, and decorate as you wish 😉.

You can find the full GitHub repo on my GitHub page or just below 😉

NicolasDuponchel/CustomItemDecoration

If it helped follow and 👏 ! Thanks you readers 🙏