react-native-loading-button

1.0.2 • Public • Published

react-native-loading-button

React native button with activity indicator

Before Loading When loading

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)

Dependencies (0)

    Dev Dependencies (0)

      Package Sidebar

      Install

      npm i react-native-loading-button

      Weekly Downloads

      1

      Version

      1.0.2

      License

      ISC

      Last publish

      Collaborators

      • xmanemran