react-native-waterfall-layout-list

waterfall-layout-list. based in react native VirtualizedList

Setup

This library is available on npm or yarn, install it with: npm i react-native-waterfall-layout-list or yarn add react-native-waterfall-layout-list.

Usage

This is a convenience wrapper around , and thus inherits its props (as well as those of <ScrollView>)

1. Import react-native-waterfall-layout-list:

import WaterfallList from 'react-native-waterfall-layout-list';

Example

<WaterFallList
        renderItem={renderItem}
        data={data}
        windowSize={5}
        keyExtractor={(item, index) => `${index}`}
        onEndReached={loadMoreData}
        ListFooterComponent={<ListFooter />}
        numColumns={2}
        getHeight={getHeight}
      />

For a more complex example take a look at the /Example directory.

Available props

Name	Type	Default	Description
getItemHieght	(item,index)=>number		get list-item height animation
numColumns	number	1	like Flatlist props but waterfall(masonry) layouts are no supported

Pull requests, feedbacks and suggestions are welcome!