如何使用react-native-reanimated-carousel在自动播放期间添加滚动延迟

问题描述 投票:0回答:1

我正在使用 React Native 复活的轮播。我的目的是在滚动到下一个项目之前延长查看每个渲染项目所花费的时间。就像自动播放延迟一样。这是代码:

  <Carousel
            loop
            width={width}
            data={data}
            scrollAnimationDuration={1000}
            autoPlay={true}
            renderItem={({item, index}) => {
              const {title, desc, image: Image, style} = item;
              return (
                <View
                  style={{
                    flex: 1,
                    justifyContent: 'center',
                  }}>
                  <Image height={height / 3} style={style} />
                  <Text
                    style={[
                      styles.textCenter,
                      styles.whiteColor,
                      {fontSize: 24, marginTop: 20, fontWeight: '900'},
                    ]}>
                    {title}
                  </Text>
                  <Text
                    style={[
                      styles.textCenter,
                      styles.whiteColor,
                      styles.font12,
                      styles.p20,
                      {maxWidth: 350, alignSelf: 'center', lineHeight: 18},
                    ]}>
                    {desc}
                  </Text>
                </View>
              );
            }}
          />

这里是输出,当前显示持续时间约为1秒。我想延长到3秒左右。

javascript react-native carousel
1个回答
0
投票

我最终解决了。该道具在库文档中进行了说明 https://reanimated-carousel.dev/props#autoplayinterval

autoPlayInterval={4000}
© www.soinside.com 2019 - 2024. All rights reserved.