rn-snag-camera

Lightweight React Native camera module to capture a photo and optionally draw annotations on it.

• iOS: AVFoundation capture, CoreGraphics composition
• Android: Camera2 capture, Canvas composition
• Optional drawing UI with react-native-svg

Install

# package
npm i rn-snag-camera
# peers used by UI layer
npm i react-native-gesture-handler react-native-svg
# iOS
cd ios && pod install

Usage

import React from 'react';
import { View } from 'react-native';
import { SnagCamera } from 'rn-snag-camera';

export default function Screen() {
  return (
    <View style={{ flex: 1 }}>
      <SnagCamera
        enableDrawing
        quality="high"
        onPhotoCaptured={(photo) => {
          // photo = { uri, width, height, fileSize?, timestamp }
          console.log('final photo', photo);
        }}
        onError={(e) => console.warn(e)}
      />
    </View>
  );
}

Flow: user taps capture → if enableDrawing true, drawing UI opens → Save returns annotated image; Cancel returns original capture.

API

Props (all optional unless stated):

• enableDrawing?: boolean – show drawing screen after capture
• onPhotoCaptured?: (photo) => void – final image (annotated or original)
• onError?: (message: string) => void
• quality?: 'low' | 'medium' | 'high' – capture quality (default 'high')
• showControls?: boolean – show default capture button (default true)
• isActive?: boolean – start/stop camera preview (default true)

Ref methods:

• capturePhoto(): Promise
• startCamera(): void
• stopCamera(): void

Types:

• CapturedPhoto: { uri: string; width: number; height: number; fileSize?: number; timestamp: number; }

Platform setup

• iOS: ensure camera permission in your app Info.plist (NSCameraUsageDescription), run pod install.
• Android: camera permission is declared by the library; request runtime permission in your app if needed.

Build

• TypeScript builds to lib via npm run build.