feat: keep the background img moving

src/ui/YooBackground.js

@@ -1,20 +1,34 @@
-import React from 'react';
+import React, {useState} from 'react';
-import {View, Image, StyleSheet} from 'react-native';
+import {Image, StyleSheet, Animated} from 'react-native';
 
 export function YooBackground() {
+  const imgPosition = useState(new Animated.ValueXY())[0];
   const styles = StyleSheet.create({
     backgroundContainer: {
-      width: '100%',
+      transform: [{translateX: -1500}],
-      height: '100%',
       position: 'absolute',
       zIndex: -1,
     },
   });
+  setInterval(() => {
+    Animated.timing(imgPosition, {
+      toValue: {
+        x: -Math.floor(Math.random() * 5000),
+        y: -Math.floor(Math.random() * 3000),
+      },
+      duration: 10000,
+      useNativeDriver: true,
+    }).start();
+  }, 10000);
   return (
-    <View style={styles.backgroundContainer}>
+    <Animated.View
+      style={[
+        styles.backgroundContainer,
+        {transform: imgPosition.getTranslateTransform()},
+      ]}>
       <Image
         source={require('../../assets/pawel-czerwinski-aelD0Zrmsy0-unsplash.jpg')}
       />
-    </View>
+    </Animated.View>
   );
 }