codepin v0.0.6

react-native-code-pin

This is a react-native component for a implements a code pin view in your project

Attention: This package is under development and evolution over time Contributions are welcome!

Installation

npm install --save pincode

or

yarn add pincode

Basic Usage

Basic usage requires Code and Size.

• Size : requires the size of the code

import PinCode from 'pincode'

<PinCode Size={4} />

Options

Example

basic use of eventCode prop

...
import PinCode from 'pincode'

export default Example extends Component {
  ...
  checkCode = (event, loading, error) => {
    if(event == 'this.state.YourCode'){
      loading(true);
      setTimeout(() => {
          loading(false)
      }, 5000);
    } else {
      error();
    }
  }
  
  render(){
    return (
        <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}> 
          <PinCode Size={4} eventCode={this.checkCode}/>
        </View>
    )
  }
}

Utilisation

• eventCode(event, error, loading)
• event() return the code entered by the user
• error() clear the animation
• loading(value) stop the loading animation value by default egal false

Styles