ReactNative: 使用活动指示器组件ActivityIndicator组件

//表示是否执行动画
animating: PropTypes.bool

//设置指示器的颜色
color: ColorPropType

//设置指示器大小，模式是samll。第二个参数仅支持安卓使用,通过设置一个数来表示大小。
size: PropTypes.oneOfType([
  PropTypes.oneOf([ ‘small‘, ‘large‘ ]),
  PropTypes.number,
])

//当动画停止时，是否隐藏
hidesWhenStopped: PropTypes.bool

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from ‘react‘;

import {
    AppRegistry,
    StyleSheet,
    View,
    Text,
    ActivityIndicator
} from ‘react-native‘;


export default class ReactNativeDemo extends Component {

    render() {
        return (
            <View style={[styles.flex,styles.bgColor,styles.center]}>
                <ActivityIndicator
                    animating={true}
                    color={‘red‘}
                    size={‘large‘}
                    hidesWhenStopped={true}
                />
                <Text/>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    flex: {
        flex: 1
    },
    bgColor: {
      backgroundColor: ‘#1FB9FF‘
    },
    center: {
        alignItems: ‘center‘,
        justifyContent: ‘center‘
    }
});

AppRegistry.registerComponent(‘ReactNativeDemo‘, () => ReactNativeDemo);