Question

我有FlatList元素：

<FlatList
    ref={listRef}
    data={data}
    onLayout={_onLayoutDimensionsChanged}
    keyExtractor={_keyExtractor}
    renderItem={_renderItem}
    initialScrollIndex={initialScrollIndex}
    onViewableItemsChanged={onViewableItemsChanged}
    viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
    ItemSeparatorComponent={ItemSeparator}
    snapToInterval={totalItemWidth}
    decelerationRate={0.0}
    getItemLayout={(data, index) => ({
      length: totalItemWidth,
      offset: totalItemWidth * index,
      index
    })}
    initialNumToRender={2}
    showsHorizontalScrollIndicator={false}
    removeClippedSubviews
    bounces
    horizontal
  />

totalItemWidth为：

totalItemWidth = itemsWidth + SEPARATOR_SIZE;

我想实现，滑动手势最多可以移动一项，但是即使将减速率设置为decelerationRate={0.0}，我的清单也可以刷2项如果我用手指滑动的速度比正常滑动的速度快一点。

有什么办法可以防止在那里发生两次刷卡吗？我正在实施图片库，因此当用户一次可以滑动两张照片时，它不是非常友好。

非常感谢您！

Answer 1

在您的 FlatList 中使用 disableIntervalMomentum={ true }。这将只允许用户一次水平滚动一页：

<AnimatedFlatList
                    disableIntervalMomentum={true} // use this
                    contentInset={{right: wp('20%')}}
                    showsHorizontalScrollIndicator={false}
                    ItemSeparatorComponent={separatorComponent}
                    decelerationRate={0.0}
                    snapToInterval={ITEM_SIZE}
                    horizontal={true}
                    scrollEventThrottle={1}
                    onScroll={onScrollEvent}
                    data={filteredData.filteredData}
                    renderItem={renderItem}
                    keyExtractor={keyExtractor}
                />

Flatlist每一滑动手势最多滚动一个项目

1 个答案: