recyclerlistview icon indicating copy to clipboard operation
recyclerlistview copied to clipboard

Masonry layout manager and provider

Open dwidc opened this issue 5 years ago • 15 comments

Added staggered grid / masonry layout. I made this as #175 has no follow-ups.

Currently only support vertical orientation, horizontal layout is not yet implemented.

dwidc avatar Jul 15 '20 06:07 dwidc

I use it by copy it to my code, but it work little strangely when load more data, it overlap the pre data.

fzp0723 avatar Aug 18 '20 08:08 fzp0723

@dwidc I find the reason. When call dataProvider.cloneWithRows method and not set firstModifiedIndex param, your relayoutFromIndex method will go wrong because the startIndex is not zero.

fzp0723 avatar Aug 18 '20 09:08 fzp0723

@Paul0523 Can you elaborate more? Maybe with some sample codes?

I never set firstModifiedIndex when calling dataProvider.cloneWithRows(), and relayoutFromIndex() works just fine. If I remember correctly, relayoutFromIndex() can be called multiple times, and its startIndex param could be > 0.

dwidc avatar Aug 27 '20 03:08 dwidc

how to include this pr to my react native project please help

mshafex avatar Jan 14 '21 14:01 mshafex

Please merge/add masonry layout to this library! It would be the best thing ever 'cause there are no libraries that support infinite scroll + recycling + masonry! See also this: https://github.com/Flipkart/recyclerlistview/pull/175 @naqvitalha @muskeinsingh

Mattesackboy avatar Apr 04 '21 15:04 Mattesackboy

when using with infinite scroll, picture can't be added? also, when using this grid, onEndReached will trigger twice?

lclrobert2020 avatar Oct 19 '21 10:10 lclrobert2020

when using with infinite scroll, picture can't be added? also, when using this grid, onEndReached will trigger twice?

Bug found, it seems that the creator forget that array starts from 0, so that the algo can't add new items after the first time, as it always finding the item with index+1

lclrobert2020 avatar Oct 19 '21 19:10 lclrobert2020

@dwidc any updates on this PR? also, can you provide us a demo to show How to use this new provider? Thank you very much!

chj-damon avatar Jan 13 '22 10:01 chj-damon

@lclrobert2020 any update?

chj-damon avatar Jan 13 '22 10:01 chj-damon

@lclrobert2020 any update?

I made it work a few months ago, but I forget where did I put my code, I will update a working example asap

lclrobert2020 avatar Jan 13 '22 11:01 lclrobert2020

@lclrobert2020 Thank you so much!

chj-damon avatar Jan 13 '22 11:01 chj-damon

@lclrobert2020 Thank you so much!

https://snack.expo.dev/@robertli93/grid_example

this is my expo snack

I have uploaded a working masonrylayoutmanager to the npm but I didn't have time to write readme,

this masonrylayoutmanager is a fixed version of other people's work ( sorry i forget who and where is the original)

so credit should also give to them

there are some minor problems with the snack e.g. using UNSAFE_componentWillMount, I will write a better one if I had time

lclrobert2020 avatar Jan 14 '22 03:01 lclrobert2020

Thanks for sharing. Btw, does it support the responsive layout? I mean: on the screen-width resize how to change & redraw the item columns?

velidan avatar Jan 25 '22 19:01 velidan

Why is it not merged yet ??

mohity777 avatar Aug 06 '22 23:08 mohity777

MasonryFlashList will meet your needs

Use High performance mode, have a look at https://github.com/Shopify/flash-list/issues/946#issuecomment-1972392998

zyestin avatar Mar 01 '24 03:03 zyestin