Prevent Screenshots in your React Native app when needed. πŸ¦„

Overview

React Native Prevent Screenshots

Prevent Screenshots in your React Native app when needed. πŸ¦„

Installation

First, you need to install the package using the command above:

npm install react-native-prevent-screenshots --save

Or if you're using Yarn:

yarn add react-native-prevent-screenshots

React Native <= 0.59

For React Native <= 0.59, there's no autolinking so you have to link the package using the command below:

react-native link react-native-prevent-screenshots

Expo Managed Workflow Support

In order to use react-native-prevent-screenshots with Expo you have to have native android folder in your app, fortunately you can do that easily without ejecting just by using this command:

expo run:android

which will generate the android folder for you and allow you to use custom native code for android while still using Expo managed workflow.

NOTE: you don't have to do the same for iOS because we use the React Native AppState JavaScript API on iOS.

Usage

For iOS support you have to wrap the App component with the withPreventScreenshots call like this:

import { withPreventScreenshots } from 'react-native-prevent-screenshots';

function App() {
  // ...
}

export default withPreventScreenshots(App);

Now, you can now call PreventScreenshots.start() and PreventScreenshots.stop() functions anywhere in your app to start/stop preventing screenshots.

import { PreventScreenshots } from 'react-native-prevent-screenshots';

// Prevent Screenshots (returns `Promise<boolean>` of the prevention state)
PreventScreenshots.start();

// Allow Screenshots (returns `Promise<boolean>` of the prevention state)
PreventScreenshots.stop();
You might also like...

corrects your sitting posture and provides feedback in real time in conjunction with the app. A sensor of 31 cells detects your posture to get better life-wellness

corrects your sitting posture and provides feedback in real time in conjunction with the app. A sensor of 31 cells detects your posture to get better life-wellness

Notichair μ‹€μ‹œκ°„ μžμ„ΈλΆ„μ„ 및 ꡐ정 μŠ€λ§ˆνŠΈμ²΄μ–΄ πŸ† 상λͺ…λŒ€ν•™κ΅ PRIME κ²½μ§„λŒ€νšŒ μˆ˜μƒ πŸ† μš”κ΅¬μ‚¬ν•­ 31-cell sensor (mdxs-16-5610) λͺ©μ°¨ 1. μ†Œκ°œ ν”„λ‘œμ νŠΈ λ‚΄μš© μ†Œκ°œ 2. 개발 ν™˜κ²½ 사전 μ„€μ • 및 ν™˜κ²½ ꡬ좕 3. κΈ°λŠ₯ Sensors Ap

Jan 15, 2022

DM Movie is an app with several movies catalogued through a database, you enter your email and your rating of the movie

DM Movie is an app with several movies catalogued through a database, you enter your email and your rating of the movie

DM Movie is an app with several movies catalogued through a database, you enter your email and your rating of the movie

Jan 28, 2022

A React Native project starter with Typescript, a theme provider with hook to easy styling component, a folder architecture ready and some configs to keep a codebase clean.

React Native Boilerplate Folder structure : src β”œβ”€β”€ assets β”‚Β Β  β”œβ”€β”€ audios β”‚Β Β  β”œβ”€β”€ fonts β”‚Β Β  β”œβ”€β”€ icons β”‚Β Β  └── images β”œβ”€β”€ components β”‚Β Β  β”œβ”€β”€ Layout.tsx

Sep 1, 2022

Lightweight React Native UI Components inspired on Vant

vant-react-native Install yarn add vant-react-native Or npm install vant-react-native Usage import React, { Component } from 'react'; import { View, T

Sep 29, 2022

Admob for React Native with powerful hooks and components

React Native Admob ⚠️ Please note, this package is under active development, which means it may be not stable to apply on production. Please use this

Jan 6, 2023

React Native wrapper around Indy SDK Java and Objective-C wrappers.

React Native Indy SDK React Native Indy SDK wrapper. Installation with npm: $ npm install indy-sdk-react-native --save with Yarn: $ yarn add indy-sdk-

Dec 5, 2022

Ship React Native .jsbundles compressed by Brotli algorithm.

Ship compressed JS bundles Warning: not yet available for Android. Sometimes you need a very small .app, for example if you are building an App Clip.

Nov 15, 2022

Using turborepo & react-native

Turborepo starter with NPM This is an official starter turborepo. What's inside? This turborepo uses NPM as a package manager. It includes the followi

Feb 16, 2022

This is a Food Delivery Mobile Application. Build Using React Native

This is a Food Delivery Mobile Application. Build Using React Native

Ax Food Delivery Service This is a Food Delivery Mobile Application build using π‘πžπšπœπ­ 𝐍𝐚𝐭𝐒𝐯𝐞 πŸ’™ Installation Clone this repository git clon

Jul 14, 2022
Comments
  • TypeError: undefined is not an object (evaluating '_AppState$addEventLis.remove')

    TypeError: undefined is not an object (evaluating '_AppState$addEventLis.remove')

    Hello, thanks for the component that you developed. I am getting this error when I run the app:

    TypeError: undefined is not an object (evaluating '_AppState$addEventLis.remove')

    I warped my app.js using export default withPreventScreenshots(App) and then receive the error. react native 64.0.1 platform iOS

    Can you please help me?

    opened by saeedtkh 6
  • No hope in Expo? 😒

    No hope in Expo? 😒

    Steps to reproduce

    1. expo init
    2. code below
    import { StatusBar } from 'expo-status-bar';
    import React from 'react';
    import { useEffect } from 'react';
    import { Button, StyleSheet, Text, View } from 'react-native';
    import { withPreventScreenshots, PreventScreenshots } from 'react-native-prevent-screenshots';
    
    const App = () => {
      useEffect(() => {
        PreventScreenshots.start();
      }, [])
      return (
        <View style={styles.container}>
          <Text>Open up App.tsx to start working on your app!</Text>
          <StatusBar style="auto" />
        </View>
      );
    }
    
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
      },
    });
    
    export default withPreventScreenshots(App);
    
    1. throws this error
    TypeError: null is not an object (evaluating 'Native.start')
    
    This error is located at:
        in App (created by ExpoRoot)
        in ExpoRoot
        in RCTView (created by View)
        in View (created by AppContainer)
        in RCTView (created by View)
        in View (created by AppContainer)
        in AppContainer
    at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
    at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
    at node_modules/react-native/Libraries/Core/ReactFiberErrorDialog.js:43:2 in showErrorDialog
    
    TypeError: null is not an object (evaluating 'Native.start')
    
    This error is located at:
        in App (created by ExpoRoot)
        in ExpoRoot
        in RCTView (created by View)
        in View (created by AppContainer)
        in RCTView (created by View)
        in View (created by AppContainer)
        in AppContainer
    at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
    at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
    at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
    at node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:12:21 in ErrorUtils.setGlobalHandler$argument_0
    

    I also copy pasted your example code, but throws the same error

    opened by devhyunjae 2
  • Prevent Screenshots not working as should on iOS Devices.

    Prevent Screenshots not working as should on iOS Devices.

    I have added this package to stop screenshots on iOS devices but it is not working as expected. I expected it to prevent screenshots however screenshots are still enabled.

    React Native Version - 0.70.1 react-native-prevent-screenshots - ^2.0.0-nightly.1

    I am using a physical device not a simulator.

    Example: https://user-images.githubusercontent.com/40200357/195306084-53fd44d1-c749-4dd8-bc34-e816327b328e.mov

    opened by kyagie 1
Releases(2.0.0-nightly.1)
Owner
Ahmed Mahmoud
Building quality software.
Ahmed Mahmoud
Sceneform React Native AR Component using ARCore and Google Filament as 3D engine. This the Sceneform Maintained Component for React Native

Discord Server Join us on Discord if you need a hand or just want to talk about Sceneform and AR. Features Remote and local assets Augmented Faces Clo

SceneView Open Community 42 Dec 17, 2022
πŸ‘Ύ A React Native app to visualize your NFTs in AR

AR NFT ?? Description AR NFT is a mobile app developed using React Native, Wallet Connect, and Viro React to allow users to login in your favorite wal

Akinn Rosa 79 Nov 11, 2022
A Java SDK for the ScreenshotOne.com API to take screenshots of any URL

jsdk An official Screenshot API client for Java. It takes minutes to start taking screenshots. Just sign up to get access and secret keys, import the

ScreenshotOne.com 5 Jun 7, 2022
React native wrapper for Jitsi Meet SDK Library that rely on the native view (Activity / ViewController)

react-native-jitsi-meet-sdk React native wrapper for Jitsi Meet SDK Library. This Library implements the Jitsi SDK with a native activity on the Andro

null 7 May 2, 2022
An awesome native wheel picker component for React Native.

⛏️ react-native-picky An awesome native wheel picker component for react-native. Features Supports multiple columns βœ… Supports looping βœ… Native Androi

null 28 Dec 4, 2022
This app corrects your sitting posture and provides feedback in real time in conjunction with the app. A sensor of 31 cells detects your posture to get better life-wellness

Notichair μ‹€μ‹œκ°„ μžμ„ΈλΆ„μ„ 및 ꡐ정 μŠ€λ§ˆνŠΈμ²΄μ–΄ ?? 상λͺ…λŒ€ν•™κ΅ PRIME κ²½μ§„λŒ€νšŒ μˆ˜μƒ ?? μš”κ΅¬μ‚¬ν•­ 31-cell sensor (mdxs-16-5610) λͺ©μ°¨ 1. μ†Œκ°œ ν”„λ‘œμ νŠΈ λ‚΄μš© μ†Œκ°œ 2. 개발 ν™˜κ²½ 사전 μ„€μ • 및 ν™˜κ²½ ꡬ좕 3. κΈ°λŠ₯ Sensors Ap

Minuk_LEE 3 Jan 15, 2022
Project developed for MB Talk - App Center integration on React Native

App Center Setup Download APK Click here Requirements React Native CLI Yarn Sign Up on App Center and create a new App. How to use this repo Clone thi

AndrΓ© Angeloni 2 Oct 31, 2022
React Native app demonstrating using xmtp-js to send a message

XMTP React Native Example This is a work in progress to demonstrate importing xmtp-js into a React Native app. The example currently generates a rando

XMTP 19 Dec 20, 2022
An implementation of a sample E-Commerce app in k8s. This online retail marketplace app uses Spring Boot, React, and YugabyteDB.

An implementation of a sample E-Commerce app in k8s. This online retail marketplace app uses Spring Boot, React, and YugabyteDB.

yugabyte 1 Oct 27, 2022
Template to speed up your development in React Native projects.

React Native SpaceShip I created this template with the purpose of leaving the development environment already configured for use. ?? How to use it in

Lucas Augusto 3 Mar 23, 2022