Awesome
<p align="center"><br><img src="https://user-images.githubusercontent.com/236501/85893648-1c92e880-b7a8-11ea-926d-95355b8175c7.png" width="128" height="128" /></p> <h3 align="center">Privacy Screen</h3> <p align="center"><strong><code>@capacitor-community/privacy-screen</code></strong></p> <p align="center"> Capacitor Privacy Screen Plugin </p> <p align="center"> <img src="https://img.shields.io/maintenance/yes/2024?style=flat-square" /> <a href="https://github.com/capacitor-community/privacy-screen/actions?query=workflow%3A%22CI%22"><img src="https://img.shields.io/github/actions/workflow/status/capacitor-community/privacy-screen/ci.yml?branch=main&style=flat-square" /></a> <a href="https://www.npmjs.com/package/@capacitor-community/privacy-screen"><img src="https://img.shields.io/npm/l/@capacitor-community/privacy-screen?style=flat-square" /></a> <br> <a href="https://www.npmjs.com/package/@capacitor-community/privacy-screen"><img src="https://img.shields.io/npm/dw/@capacitor-community/privacy-screen?style=flat-square" /></a> <a href="https://www.npmjs.com/package/@capacitor-community/privacy-screen"><img src="https://img.shields.io/npm/v/@capacitor-community/privacy-screen?style=flat-square" /></a> <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section --> <a href="#contributors-"><img src="https://img.shields.io/badge/all%20contributors-0-orange?style=flat-square" /></a> <!-- ALL-CONTRIBUTORS-BADGE:END --> </p>Introduction
⚡️ Capacitor plugin that protects your app from displaying a screenshot in Recents screen/App Switcher.
On Android, this plugin sets the FLAG_SECURE flag to treat the content of the window as secure, preventing it from appearing in screenshots or from being viewed on non-secure displays.
On iOS, this plugin hides the webview window when the app is no longer active and loses focus (UIApplicationWillResignActiveNotification) so that a gray screen is shown instead. It also prevents screenshots (a black screen will be captured).
Using the Camera Plugin
Disabling screenshots can interfere with plugins that hide the WebView like the Camera plugin. To avoid issues call disable
before using a plugin and then enable
after you are finished.
Maintainers
Maintainer | GitHub | Social |
---|---|---|
Robin Genz | robingenz | @robin_genz |
Installation
npm install @capacitor-community/privacy-screen
npx cap sync
Configuration
<docgen-config> <!--Update the source file JSDoc comments and rerun docgen to update the docs below-->These configuration values are available:
Prop | Type | Description | Default | Since |
---|---|---|---|---|
enable | <code>boolean</code> | Configure whether the plugin should be enabled from startup. Only available for Android and iOS. | <code>true</code> | |
imageName | <code>string</code> | Configure whether the plugin should display a custom image from assets instead of a default background gray for the privacy screen. Only available for iOS. | <code>""</code> | |
contentMode | <code>'center' | 'scaleToFill' | 'scaleAspectFit' | 'scaleAspectFill'</code> | Configure the content mode of displayed image. Only available for iOS. | <code>"center"</code> | |
preventScreenshots | <code>boolean</code> | Configure whether the plugin should prevent screenshots if enabled. Only available for iOS. | <code>true</code> | 5.2.0 |
Examples
In capacitor.config.json
:
{
"plugins": {
"PrivacyScreen": {
"enable": true,
"imageName": "Splashscreen",
"contentMode": "scaleAspectFit",
"preventScreenshots": false
}
}
}
In capacitor.config.ts
:
/// <reference types="@capacitor/privacy-screen" />
import { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
plugins: {
PrivacyScreen: {
enable: true,
imageName: "Splashscreen",
contentMode: "scaleAspectFit",
preventScreenshots: false,
},
},
};
export default config;
</docgen-config>
Demo
A working example can be found here: robingenz/capacitor-plugin-demo
Usage
The plugin only needs to be installed. The protection is enabled by default.
However, you have the option to enable/disable the protection:
import { PrivacyScreen } from '@capacitor-community/privacy-screen';
const enable = async () => {
await PrivacyScreen.enable();
};
const disable = async () => {
await PrivacyScreen.disable();
};
API
<docgen-index>enable()
disable()
addListener('screenRecordingStarted', ...)
addListener('screenRecordingStopped', ...)
addListener('screenshotTaken', ...)
removeAllListeners()
- Interfaces
enable()
enable() => Promise<void>
Enables the privacy screen protection.
Only available for Android and iOS.
Since: 1.1.0
disable()
disable() => Promise<void>
Disables the privacy screen protection.
Only available for Android and iOS.
Since: 1.1.0
addListener('screenRecordingStarted', ...)
addListener(eventName: 'screenRecordingStarted', listenerFunc: () => void) => Promise<PluginListenerHandle>
Called when the screen recording is started.
Only available on iOS for now.
Param | Type |
---|---|
eventName | <code>'screenRecordingStarted'</code> |
listenerFunc | <code>() => void</code> |
Returns: <code>Promise<<a href="#pluginlistenerhandle">PluginListenerHandle</a>></code>
Since: 3.0.2
addListener('screenRecordingStopped', ...)
addListener(eventName: 'screenRecordingStopped', listenerFunc: () => void) => Promise<PluginListenerHandle>
Called when the screen recording is stopped.
Only available on iOS for now.
Param | Type |
---|---|
eventName | <code>'screenRecordingStopped'</code> |
listenerFunc | <code>() => void</code> |
Returns: <code>Promise<<a href="#pluginlistenerhandle">PluginListenerHandle</a>></code>
Since: 3.0.2
addListener('screenshotTaken', ...)
addListener(eventName: 'screenshotTaken', listenerFunc: () => void) => Promise<PluginListenerHandle>
Called when the screenshot is taken.
Only available on iOS for now.
Param | Type |
---|---|
eventName | <code>'screenshotTaken'</code> |
listenerFunc | <code>() => void</code> |
Returns: <code>Promise<<a href="#pluginlistenerhandle">PluginListenerHandle</a>></code>
Since: 3.2.0
removeAllListeners()
removeAllListeners() => Promise<void>
Remove all listeners for this plugin.
Since: 3.0.2
Interfaces
PluginListenerHandle
Prop | Type |
---|---|
remove | <code>() => Promise<void></code> |
Changelog
See CHANGELOG.md.
License
See LICENSE.