react-native-capture-protection

🛡️ A React Native library to prevent screen capture, screenshots and app switcher for enhanced security. Fully compatible with both Expo and CLI.

screenshot	app switcher

Features

• iOS Capture Protection (Screenshot, Screen Recording, App Switcher)
• Android Capture Protection (Screenshot, Screen Recording)
• Event Listener for Capture Events
• Provider and Hooks Support
• Android 14 Support

Installation

Use npm

npm install react-native-capture-protection

Use yarn

yarn add react-native-capture-protection

use Expo

Only Expo Dev client compatible This library has native code, so it's not work for Expo Go but it's compatible with custom dev client.

npx expo install react-native-capture-protection

Setting

Android

On Android versions below 14, storage permissions are required to determine if a screen capture is enabled.

• android/app/build.gradle

    defaultConfig {
        ...
        missingDimensionStrategy "react-native-capture-protection", "fullMediaCapture"
    }

In Play Store

• Details on Google Play's Photo and Video Permissions policy READ_MEDIA_IMAGES

Used by the application to detect screenshots, to detect the presence of screenshot files on the user's media.

If you want to use it without detecting the capture, please set the following settings.

• android/app/build.gradle

    defaultConfig {
        ...
        missingDimensionStrategy "react-native-capture-protection", "restrictedCapture"
    }

How to Use

import {
  CaptureProtection,
  useCaptureProtection,
  CaptureEventType
} from 'react-native-capture-protection';

const Component = () => {
  const { protectionStatus, status } = useCaptureProtection();

  React.useEffect(() => {
    // Prevent all capture events
    CaptureProtection.prevent();

    // Or prevent specific events
    CaptureProtection.prevent({
      screenshot: true,
      record: true,
      appSwitcher: true
    });
  }, []);

  React.useEffect(() => {
    // Check if any capture is prevented
    console.log('Prevent Status:', protectionStatus);

    // Check current protection status
    console.log('Protection Status:', status);
  }, [protectionStatus, status]);

  // Allow all capture events
  const onAllow = async () => {
    await CaptureProtection.allow();
  };

  // Allow specific events
  const onAllowSpecific = async () => {
    await CaptureProtection.allow({
      screenshot: true,
      record: false,
      appSwitcher: true
    });
  };

  // Check if screen is being recorded
  const checkRecording = async () => {
    const isRecording = await CaptureProtection.isScreenRecording();
    console.log('Is Recording:', isRecording);
  };

  return (
    // Your component JSX
  );
};

Documentation

• Methods - Detailed documentation of all available methods
• Types - Type definitions and interfaces
• Migration Guide - Guide for migrating from v1.x to v2.x

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

---

Made with create-react-native-library