Noncommital Premarital Mischief

    react-native-virtualized-waterfall
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.3 • Public • Published

    react-native-waterfall

    a virtualized & infinite waterfall layout component for React-Native

    Getting started

    npm i react-native-virtualized-waterfall

    or

    yarn add react-native-virtualized-waterfall

    Preview

    online-demo

    related project: h.bilibli-rn

    h.bilibili

    Props

    please refer to type definition

    *This project layout through known item height,so you must got item size before render

    Usage

    import Waterfall from "react-native-virtualized-waterfall";
    
    <Waterfall
            columnNum={2}
            columnGap={10}
            itemInfos={this.state.items}
            bufferAmount={10}
            infiniteThreshold={500}
            heightGetter={this.heightGetter.bind(this)}
            renderItem={(itemInfo, width, height, index) => {
              return (
                <Image
                  style={{
                    height,
                    width
                  }}
                  height={height}
                  width={width}
                  source={{
                    uri: itemInfo.url
                  }}
                  resizeMode={"contain"}
                />
              );
            }}
            onRefresh={() => {
              return this.fetchItems(true);
            }}
            onInfinite={() => this.fetchItems()}
          />

    Install

    npm i react-native-virtualized-waterfall

    DownloadsWeekly Downloads

    8

    Version

    1.2.3

    License

    MIT

    Unpacked Size

    38.5 kB

    Total Files

    11

    Last publish

    Collaborators

    • fengbujue