New tools in RecyclerView: DiffUtil, SnapHelper and more (Part-1)

Samvid Mistry
CodeWord
Published in
3 min readDec 8, 2016

There has been many things going on with the support library recently. Transitions are backported, RecyclerView got faster, indirect nested scrolling is coming, and lots of things overall. Let’s talk about all the new things RecyclerView has got for us in this article, and use some stuff which was already there. First up, all the code for this article and future articles in this series is already available on github at this link: https://github.com/samvidmistry/RecyclerViewAdditions

First off, let’s take a look at what we’ll be making here:

https://www.youtube.com/watch?v=dQ9NFfY8EDM

Please don’t mind the bad design of the screen, the code that goes into making the screen is beautiful. So, first let me describe what components go into making of this screen. First of all, there is a RecyclerView, obviously. It contains another RecyclerView as its first child and other children are normal layout items. All the items in main RecyclerView contains borders. I made use of ItemDecorations in order to draw borders around items. In order to get the sample data, I have used https://jsonplaceholder.typicode.com/

The simplest RecyclerView component in the app is ItemDecoration, so let’s first discuss about that. ItemDecorations are simple yet very powerful components which makes RecyclerView pluggable and customizable, without touching or messing with the core functionality of any other components such as RecyclerView iteself or LayoutManager or even Adapter. It has got a simple API, only 3 methods mainly.

  1. getItemOffsets()
getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state)

This method allows you to provide offsets for the item. You need to modify the outRect object and add offsets to your item layout.

Here, we don’t want to provide any offsets to our first child as it is a whole different section containing different items, but for all the other items, we want them to be offset by 25 pixels, so we modified the rect to be 25 pixels.

2. onDraw

onDraw(Canvas c, RecyclerView parent, RecyclerView.State state)

This method gives you a chance to draw anything on the canvas before the child draws itself. You can use it to draw backgrounds, borders and if your item is translucent, you can use it to draw some texture under your item. I have used it to draw a border around the item with text.

Again, we skip the first child, then I have recorded the bounds of the child view in mRect object, then I modify the bound of rect to increase the width and height of the rect. Finally, I draw a rect according to the mRect object. Here the mPaint is a normal Paint object and the style is set to STROKE.

3. onDrawOver()

onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state)

This method is called after the child has drawn itself. This can also be used to draw any borders around the child. Moreover, it can be used to draw a translucent foreground on your child and many other ideas that you can think of.

onDrawOver is really similar to what you do in an onDraw call. The difference is that everything you draw here willl be drawn over the child so you have to be a little careful here that you don’t end up drawing something over the actual content of the list.

This is it for RecyclerView.ItemDecorations. It is an abstract class so there is no any internal logic to be explained except these 3 methods which are called by RecyclerView from time to time. In next article, we will see another component of RecyclerView in detail, starting from implementation to nitty gritty internals and the design of the class.

--

--