'use strict';

import React, {Component} from 'react'
import {
    StyleSheet,
    View,
    Text,
    Dimensions,
    ActivityIndicator,
    Platform,
} from 'react-native';
import PropTypes from 'prop-types';

export default class LoadMoreIndicator extends Component {

    static propTypes = {
        isVisible: PropTypes.bool.isRequired,
        animating: PropTypes.bool,
        text: PropTypes.string,
    };

    static defaultProps = {
        text: '加载中...',
    };

    render() {
        if (this.props.isVisible) {
            return (
                <View style={styles.container}>
                    {this.props.animating ?
                        <ActivityIndicator style={styles.indicator} size={'small'} /> :
                        null}

                    <Text style={styles.text}>{this.props.text}</Text>
                </View>
            );
        } else {
            return null;
        }
    }
}

const styles = StyleSheet.create({
    container: {
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
        width: Dimensions.get('window').width,
        height: 44,
    },
    indicator: {

    },
    text: {
        marginLeft: 10,
        textAlign: 'center',
        color:'#b1b1b1',
    },
});