https://github.com/mabt-tech-com/flutter-prevent-screenshot-example
✅ flutter-prevent-screenshot-on-mobile-example ~ this is only a simple example that will help you to better understand and will help you with your coding :)
https://github.com/mabt-tech-com/flutter-prevent-screenshot-example
app flutter hey
Last synced: 2 months ago
JSON representation
✅ flutter-prevent-screenshot-on-mobile-example ~ this is only a simple example that will help you to better understand and will help you with your coding :)
- Host: GitHub
- URL: https://github.com/mabt-tech-com/flutter-prevent-screenshot-example
- Owner: mabt-tech-com
- Created: 2023-02-13T10:05:03.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-03-15T19:14:39.000Z (about 2 years ago)
- Last Synced: 2025-01-22T18:11:13.417Z (4 months ago)
- Topics: app, flutter, hey
- Language: HTML
- Homepage:
- Size: 1.01 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Flutter - Prevent Screenshots and Screen Recordings on mobile & web [2021]
## 🎬 Tuto Video : [https://.../yil6EE2Fivo](yil6EE2Fivo)
https://youtu.be
https://youtu.be/
### ✌ Preview
---
---
# How can I block screenshots on flutter web application ?
## How can I block screenshots on flutter web application ?
Blocking screenshots on a Flutter web application can be a bit tricky, as there is no built-in way to do this in the framework.
However, here are a few approaches you can try:
1. Use a library like html2canvas to take screenshots of the web page and then use JavaScript to detect and block them.
2. Use CSS to prevent the user from selecting and copying text or images on the page.
3. Use the **`preventDefault()`** method on the **`contextmenu`** event to prevent the right-click menu from appearing, which blocks the option to take a screenshot.
Please note that these solutions may not be foolproof and determined users may still be able to take screenshots. Also, as with any security measures, it's always best to stay up-to-date with the latest techniques and best practices.
---
## On a flutter web application how to Use CSS to prevent the user from selecting and copying text or images on the page ?
You can use CSS to prevent the user from selecting and copying text or images on a Flutter web application by adding the following CSS styles to the **`head`** of your HTML document:
```
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
```
This will disable text selection and copying for the entire page.
Alternatively, you can add the **`unselectable`** attribute to specific elements to prevent them from being selected:
```
This text cannot be selected
```
You can also use **`pointer-events: none`** CSS property on the element that you want to prevent the user from copying or selecting it.
Please note that disabling text selection and copying may have negative effects on accessibility, it's best to consider this when implementing this feature.