Signature View for React Native(Android+IOS).
npm install react-native-signviewSignature view for react-native.
npm i react-native-signviewreact-native link
...
import {Text, Button, View} from 'react-native';
import { SignatureView } from 'react-native-signview';export default class SomeComponent extends Component {
...
render() {
return (
);
}
}
Properties
* style: View Styles
* signatureColor: Color for signature(stroke color)
* strokeWidth: width of signature (stroke width)Callbacks
* onChangeInSign: Triggered whenever there is a change in signature. Base64 string of signature will be passed as parameter.Methods
* clearSignature: When called it'll clear the signature. onChangeInSign gets triggered with null as parameter.Example
import React, {Component} from 'react';
import { StyleSheet, Text, Button, View} from 'react-native';
import { SignatureView } from 'react-native-signview';export default class App extends Component {
constructor(props){
super(props);
this.signView = React.createRef();
}
clearSignature = () => {
if(this.signView && this.signView.current){
this.signView.current.clearSignature();
}
}
onChangeInSign = (base64StringOfSign) => {
if(base64StringOfSign){
console.log('Signature Available', base64StringOfSign.length);
} else{
console.log('No Signature');
}
}
render() {
return (
Sign in below box
/>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
});