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