RecyclerView - horizontal, two-row grid, second row offset

Question

I am trying to make a horizontally scrolling grid. It has two rows. The second row is offset (by half the width of one item, but that is trivial to calculate and doesn't matter here).

I am currently using RecyclerView and the GridLayoutManager from https://github.com/antoniolg/RecyclerViewExtensions/tree/master/library/src/main/java/com/antonioleiva/recyclerviewextensions

However, the offsetting is proving extremely difficult.

It should end up looking like

Does anybody have any suggestions for making the second row staggered like in the picture above?

Answer 1

Use StaggeredGridLayoutManager with an ItemDecoration which adds the offset to the item at adapter position 0. You'll get the desired output. (via getItemOffsets). Alternatively, instead of an ItemDecoration, when onBind is called, you can set the first item's width such that it will include gap on left.

If your data set changes, don't call notifyDataSetChanged which will reset the historical calculations in SGLM. Instead, use detailed notify events like notifyItemRangeInserted so that SGLM will be able to recalculate layout without resetting positions.