react-native-waterfall-list

An react-native waterfall list use pure react-native component

Usage no npm install needed!

<script type="module">
  import reactNativeWaterfallList from 'https://cdn.skypack.dev/react-native-waterfall-list';
</script>

README

react-native-waterfall-list

styled with prettier

Better designed API from react-native waterfall-list. This is a high performance listview for React Native with support for complex layouts. JS only with no native dependencies.

Install

npm i react-native-waterfall-list --save

Usage

Do not gorget put item height within list when pass data props!

import Waterfall from 'react-native-waterfall-list'

        <Waterfall
          // ListHeaderComponent={this.renderHeader}
          // ListFooterComponent={this.renderFooter}
          // ListEmptyComponent={this.renderEmpty}
          onEndReached={this.onEndReached}
          onRefresh={this.onRefresh}
          onViewableItemsChanged={this.onViewableItemsChanged}
          refreshing={false}
          ref={this._captureRef}
          keyExtractor={this._keyExtractor}
          renderItem={this._renderItem}
          numColumns={2}
          gap={10}
          refreshControl={
            <RefreshControl
              refreshing={this.state.isRefreshing}
              onRefresh={this.refresh}
            />
          }
        />

API

Just with the sanme API like ScrollView。

Features

waterfall support with react-native base list provided smooth slide effect with react-antive-animation