1import React from 'react'; 2import {StyleSheet, View} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import {ActivityIndicator} from 'react-native'; 5import ThemeText from './themeText'; 6import useColors from '@/hooks/useColors'; 7 8interface ILoadingProps { 9 text?: string; 10 showText?: boolean; 11 height?: number; 12} 13export default function Loading(props: ILoadingProps) { 14 const colors = useColors(); 15 const {showText = true, height, text} = props; 16 17 return ( 18 <View style={[style.wrapper, {height}]}> 19 <ActivityIndicator animating color={colors.text} /> 20 {showText ? ( 21 <ThemeText 22 fontSize="title" 23 fontWeight="semibold" 24 style={style.text}> 25 {text ?? '加载中...'} 26 </ThemeText> 27 ) : null} 28 </View> 29 ); 30} 31 32const style = StyleSheet.create({ 33 wrapper: { 34 width: '100%', 35 flex: 1, 36 justifyContent: 'center', 37 alignItems: 'center', 38 }, 39 text: { 40 marginTop: rpx(48), 41 }, 42}); 43