Javascript 在React Native中滑动背景图像

我想创建一个由4个图像组成的背景，这些图像将从左向右滑动，每个图像延迟2秒。我有本地存储的图像。我不知道如何才能做到这一点

谢谢你的时间

---

克里斯。

这是你问题的逻辑示例

const { width, height } = Dimensions.get('window');
export default class CustomApp extends Component {

  componentDidMount() {
    let scrollValue = 0;
    setInterval(function(){
      scrollValue = scrollValue + width;   // width = screen width 
      _scrollView.scrollTo({x: scrollValue}) 
    }, 3000);
  }
  render() {
    return (
     <View>
       <ScrollView 
        ref={(scrollView) => { _scrollView = scrollView; }}
        horizontal={true} pagingEnabled={true} 
        >
          <Image source={require('./1.jpg')} style={{height, width}} />
          <Image source={require('./2.jpg')} style={{height, width}} />
          <Image source={require('./1.jpg')} style={{height, width}} />
          <Image source={require('./2.jpg')} style={{height, width}} />
       </ScrollView>
       <View style={{ position: 'absolute'}}>
         <Text>Page Content</Text>
      </View>
     </View>
    );
  }
}

const{width，height}=Dimensions.get（'window'）；
导出默认类CustomApp扩展组件{
componentDidMount（）{
设scrollValue=0；
setInterval（函数（）{
scrollValue=scrollValue+宽度；//宽度=屏幕宽度
_scrollView.scrollTo（{x:scrollValue}）
}, 3000);
}
render（）{
返回(
{{u scrollView=scrollView；}}
水平={true}paginEnabled={true}
>
页面内容
);
}
}

补充了JainZz的答案，下面是我制作图像无限幻灯片的方法

componentDidMount() {
    const numOfBackground = 4;
    let scrollValue = 0, scrolled = 0;
    setInterval(function () {
        scrolled++;
        if(scrolled < numOfBackground)
            scrollValue = scrollValue + width;
        else{
            scrollValue = 0;
            scrolled = 0
        }
        _scrollView.scrollTo({ x: scrollValue, animated: false })
    }, 3000);
}

componentDidMount（）{
常量numOfBackground=4；
让scrollValue=0，scrolled=0；
setInterval（函数（）{
滚动++；
如果（滚动

---

我添加了一个逻辑来检查它是否是最后一个图像，并将其滚动回第一个图像。我还将scrollTo prop animated更改为false，使其看起来更平滑

使用我将自动更改背景的水平滚动视图。我在ScrollView tho的文档中看不到这样的属性。太好了！谢谢你的帮助，这才是我真正需要的。有没有办法让这些图片无限循环？当加载4幅图片时，尝试将scrollView的contentOffset设置为x:0…我还没有实现它。请检查并查看结果。。。