Initial commit

components/RotatingIcon/index.jsx

@@ -0,0 +1,32 @@
+import React, { useEffect, useRef } from 'react';
+import { Animated, View } from 'react-native';
+import { Icon } from '@ant-design/react-native'
+
+const RotatingIcon = () => {
+  const spinAnim = useRef(new Animated.Value(0)).current; // 创建一个新的 Animated.Value 实例
+
+  useEffect(() => {
+    Animated.loop(
+      Animated.timing(spinAnim, {
+        toValue: 1,
+        duration: 800,
+        useNativeDriver: true, // 这是推荐的做法
+      })
+    ).start();
+  }, [spinAnim]);
+
+  const spin = spinAnim.interpolate({
+    inputRange: [0, 1],
+    outputRange: ['0deg', '360deg'],
+  });
+
+  return (
+    <View style={{ alignItems: 'center', justifyContent: 'center', flex: 1 }}>
+      <Animated.View style={{ transform: [{ rotate: spin }] }}>
+        <Icon name="loading-3-quarters" size={24} color="#999999" />
+      </Animated.View>
+    </View>
+  );
+};
+
+export default RotatingIcon;