React-native: Does SectionList support multiple columns?

[irrigator]

Description

I try to build a sectioned list with multiple columns on a row using ListView and flex-wrap (following the UIExplorer example). The problem is that both section header and list header component are positioned as "columns" among the normal cells, which breaks the layout.

I see that the new FlatList has a numColumns props but the new SectionList doesn't.

Questions

How to implement a multi-column sectioned list in React Native? Which component should I use?

[hramos]

This issue looks like a question that would be best asked on StackOverflow.

StackOverflow is amazing for Q&A: it has a reputation system, voting, the ability to mark a question as answered. Because of the reputation system it is likely the community will see and answer your question there. This also helps us use the GitHub bug tracker for bugs only.

Will close this as this is really a question that should be asked on StackOverflow.

[Geforceyu]

has solution now? Thanks!

[tiempham]

@Geforceyu. How please!

[GantMan]

@irrigator If you useflexWrap: 'wrap' like we used to have to do on ListViews, it works, but it gives a yellowbox warning about virtual lists not supporting it... but then again... it supports it.

[rewieer]

I've tried the solution of flexWrap, but it seems like it's a false solution. My section list stutters even through I have only 30 items in the list.

[tiempham]

I have used FlashList as an item of section list. So it worked perfectly for me.

[cesardeazevedo]

I recommend masonry-list to achieve multiple columns which is on top of FlatList https://github.com/AppAndFlow/react-native-masonry-list

[rewieer]

Ok, so the problem was related to the images contained in my list that were too heavy. Using size-reduced images makes it work again.

[arnsa]

So is using flexWrap on SectionList the correct way of doing this?