react-native-loading-button

React native button with activity indicator

Install

npm install react-native-loading-button --save

Example

import LoadingButton from 'react-native-loading-button';

export default class example extends Component {

    constructor(props){
        super(props);
        this.state = {
            isLoading: false
        };
    }

    onPressHandler(){
        this.setState({isLoading: true});
        setTimeout(()=>{
            this.setState({isLoading: false});
        }, 1000);
    }


    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>
                    Welcome to React Native!
                </Text>
                <LoadingButton
                    onPress={this.onPressHandler.bind(this)}
                    isLoading={this.state.isLoading}
                />
            </View>
        );
    }
}

Props

Name	Detail & Type	Default
onPress	Button On press callback (function)	alert('press')
isLoading	Start or stop animation boolean	false
activityIndicatorColor	Activity Indicator Color (string)	'#FFF'
activityIndicatorSize	Activity Indicator Size (string)	'small'
viewStyle	Main View style (object)	'small'
animationDelay	How manny time will tack to animate (number)	200
whenAnimationViewWidth	Main view size when animated	40
enableWidthAnimation	Change width when animation	true
childView	Inner child Component	Text Component (OK)