CODEWITHSUNDEEP
androidandroid-gridviewandroid-recyclerview
Eric Cochran
Eric Cochran

Reputation: 8574

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

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 1

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

Upvotes: 6

Views: 7565

Answers (2)

yigit
yigit

Reputation: 38273

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.

Upvotes: 5

wblaschko
wblaschko

Reputation: 3262

I don't know if you're still working on this, but my approach would be to render the items 2 at a time (top/bottom) with the appropriate offset, and then play with your horizontal margins (set them to negative) to create the overlap between item 2 and 3, etc.

You would have to tie OnTouchListeners to the individual items being rendered, not the RecyclerView entries.

Upvotes: 0

Related Questions