CODEWITHSUNDEEP
react-nativereact-native-flatlist
Ahmed Elsayed
Ahmed Elsayed

Reputation: 445

React native RecyclerListView and onViewableItemsChanged

i was using flatlist for my videos timeline app but i get some issues with it so i decided to change flatlist by RecyclerListView but RecyclerListView dont have onViewableItemsChanged and the onVisibleIndicesChanged is not working right and so missy any idea about how to get the isViewable item like flatlist in RecyclerListView

<RecyclerListView
          style={{ flex: 1, height, width }}
          showsVerticalScrollIndicator={false}
          dataProvider={dataProvider}
          layoutProvider={layoutProvider}
          rowRenderer={rowRenderer}
          disableRecycling={true}
          initialRenderIndex={0}
          renderAheadOffset={height}
          scrollViewProps={{
            snapToInterval: height,
            snapToAlignment: "center",
            decelerationRate: "fast",
            disableIntervalMomentum: true,
            bounces: false,
            viewabilityConfig: {
              itemVisiblePercentThreshold: 100,
              minimumViewTime: 500,
              viewAreaCoveragePercentThreshold: 100,
            },
            onViewableItemsChanged: () => console.log("Heyyyy"),
          }}
        />

Upvotes: 0

Views: 1010

Answers (1)

mohit arora
mohit arora

Reputation: 652

RecyclerListViw has prop onVisibleIndicesChanged. You can use that.

sample image

const onVisibleIndicesChanged = (all: number[], now: number[]) => {
        console.log(now)
};

It does not support viewabilityConfig as of Sept 2022. It is something in their To Do.

Upvotes: 1

Related Questions