与react-native-snap-carousel中的水平滚动有关的问题

时间:2019-10-21 12:45:46

标签: react-native-snap-carousel

我正在使用react-native-snap-carousel模块中的carousel来从远程URL水平滚动图像。它在android上运行良好,但在iOS上,有时图像会滚动,大多数时候不是。

它正在检测我的滑动动作,但是图像没有滚动。

我曾在iOS 13.1.3,react-native-0.59.8,react-native-snap-carousel 3.8.2上尝试过

以下代码用于轮播

   <Carousel
            borderTopRightRadius={2}
            borderTopLeftRadius={2}
            ref={c => (this._ref = c)}
            data={images}
            renderItem={item => this.renderItem(item)}
            onSnapToItem={index => {
              this.setState({ currentImage: index });
              onSliderMove(index);
            }}
            layout={"default"}
            sliderWidth={parentWidth || width}
            itemWidth={parentWidth || width}
            loop={circleLoop || false}
            contentContainerCustomStyle={{}}
            scrollEnabled={scrollable}
            onStartShouldSetResponderCapture={() => {
              return scrollable;
            }}
            onMoveShouldSetResponderCapture={() => {
              return scrollable;
            }}
            layoutCardOffset={20}
          />

我正在使用自定义组件加载图像。

     renderItem = ({ item, index }) => {
      return (
        <View style={{ width, height }}>
          <LoadableImage
            url={item}
            index={index}
          />
        </View>
       )
      }

预期结果:水平滚动应在iOS上顺利进行。 实际结果:水平滚动在大多数情况下不起作用。

帮我解决这个问题

1 个答案:

答案 0 :(得分:0)

我在使用此轮播时也遇到了滚动问题。我查看了库并尝试了以下属性。您可以在添加给定的属性后尝试,它们使滚动平滑。使用以下属性后,我没有遇到任何问题。

尝试最后两个属性。

<Carousel
      ref={isCarousel}
      data={options}
      renderItem={renderItem}
      sliderWidth={SLIDER_WIDTH}
      itemWidth={itemWidth || ITEM_WIDTH}
      useScrollView
      activeSlideAlignment="start"
      inactiveSlideScale={1}
      inactiveSlideOpacity={1} 
     onSnapToItem={(index) => {console.log(index); setIndex(index)}}
     *enableMomentum={true}
     decelerationRate={0.9}*
   />