React-native-signature-capture-fabric NPM

react-native-signature-capture-fabric

capture signature for react native

Installation

npm install react-native-signature-capture-fabric

Usage

import { SignatureCaptureComponent } from 'react-native-signature-capture-fabric';

// ...

export default function App() {
  const signatureCaptureComponentRef =
    React.useRef<SignatureCaptureComponent>(null);
  return (
    <ScrollView style={styles.container} centerContent>
      <SignatureCaptureComponent
        ref={signatureCaptureComponentRef}
        backgroundColor="#ffffff"
        signatureFontSize={10}
        strokeColor="#362233"
        style={styles.box}
        onSaveEvent={(saveEventResult) => {
          console.log(
            'result dataImage',
            saveEventResult.nativeEvent.dataImage
          );
          console.log(
            'result imagePath',
            saveEventResult.nativeEvent.imagePath
          );
        }}
      />
      <TouchableOpacity
        style={styles.button}
        onPress={() => {
          signatureCaptureComponentRef.current?.save();
        }}
      >
        <Text>Save</Text>
      </TouchableOpacity>
      <TouchableOpacity
        style={styles.button}
        onPress={() => {
          signatureCaptureComponentRef.current?.reset();
        }}
      >
        <Text>Reset</Text>
      </TouchableOpacity>
    </ScrollView>
  );
}