xref: /MusicFree/src/components/base/loading.tsx (revision e650bfb34226e2a09d15cbf7832c4805a87cd60e)
119dc08ecS猫头猫import React from 'react';
219dc08ecS猫头猫import {StyleSheet, View} from 'react-native';
319dc08ecS猫头猫import rpx from '@/utils/rpx';
4*e650bfb3S猫头猫import {ActivityIndicator} from 'react-native';
519dc08ecS猫头猫import ThemeText from './themeText';
6*e650bfb3S猫头猫import useColors from '@/hooks/useColors';
719dc08ecS猫头猫
8806b2764S猫头猫interface ILoadingProps {
9806b2764S猫头猫    text?: string;
10f9afcc0dS猫头猫    showText?: boolean;
11f9afcc0dS猫头猫    height?: number;
12806b2764S猫头猫}
13806b2764S猫头猫export default function Loading(props: ILoadingProps) {
14*e650bfb3S猫头猫    const colors = useColors();
15f9afcc0dS猫头猫    const {showText = true, height, text} = props;
1619dc08ecS猫头猫
1719dc08ecS猫头猫    return (
18f9afcc0dS猫头猫        <View style={[style.wrapper, {height}]}>
194060c00aS猫头猫            <ActivityIndicator animating color={colors.text} />
20f9afcc0dS猫头猫            {showText ? (
214060c00aS猫头猫                <ThemeText
224060c00aS猫头猫                    fontSize="title"
234060c00aS猫头猫                    fontWeight="semibold"
244060c00aS猫头猫                    style={style.text}>
25f9afcc0dS猫头猫                    {text ?? '加载中...'}
264060c00aS猫头猫                </ThemeText>
27f9afcc0dS猫头猫            ) : null}
2819dc08ecS猫头猫        </View>
2919dc08ecS猫头猫    );
3019dc08ecS猫头猫}
3119dc08ecS猫头猫
3219dc08ecS猫头猫const style = StyleSheet.create({
3319dc08ecS猫头猫    wrapper: {
3419dc08ecS猫头猫        width: '100%',
3519dc08ecS猫头猫        flex: 1,
3619dc08ecS猫头猫        justifyContent: 'center',
3719dc08ecS猫头猫        alignItems: 'center',
3819dc08ecS猫头猫    },
3919dc08ecS猫头猫    text: {
4019dc08ecS猫头猫        marginTop: rpx(48),
4119dc08ecS猫头猫    },
4219dc08ecS猫头猫});
43