react native 单张背景图片纵向循环向上偏移，帮我封装成组件

好的，下面是一个简单的组件代码，用于实现单张背景图片纵向循环向上偏移：

import React, { useRef, useState, useEffect } from "react";
import { View, ImageBackground } from "react-native";

const LoopingBackground = ({ imageSource, height, speed }) => {
  const backgroundRef = useRef(null); // 用于获取背景图片的引用
  const [offset, setOffset] = useState(0); // 用于保存背景图片的偏移量

  // 定时更新背景图片的偏移量
  useEffect(() => {
    const interval = setInterval(() => {
      setOffset((prevOffset) => prevOffset + speed);
    }, 1000 / 60);
    return () => clearInterval(interval);
  }, [speed]);

  return (
    <View style={{ height }}>
      <ImageBackground
        ref={backgroundRef}
        source={imageSource}
        style={{ height, width: "100%", top: -offset }}
        resizeMode="cover"
      />
    </View>
  );
};

export default LoopingBackground;

在上面的代码中，我们使用了`useRef`来获取背景图片的引用，然后在`useEffect`中定时更新背景图片的偏移量。最后，我们将背景图片放在`ImageBackground`组件中，并设置`top`样式为`-offset`来实现图片的纵向循环向上偏移。

你可以通过传递`imageSource`、`height`和`speed`三个属性来使用该组件。`imageSource`用于指定背景图片的源文件，`height`用于指定组件的高度，`speed`用于指定背景图片的偏移速度。