Sensitive Data Occlusion and Screen Blurring

UXCam ensures you can fulfil GDPR obligations. If you collect PII data (email, phone, credit card), use our APIs to hide it before it reaches UXCam servers.

Occlusion Methods Overview

Method	Purpose	Platforms
Overlay	Cover entire screen with solid color	All
Blur	Blur entire screen (adjustable radius)	All
Occlude All Text Fields	Hide all text inputs	All except Flutter
Occlude Sensitive View	Hide specific UI elements	All

Default Occlusions (No Code Required)

Platform	Auto-Occluded Elements
iOS	Text fields with `password`, `creditCardNumber`, `newPassword`, `oneTimeCode` content types
Android	Password fields with `textPassword` input type
React Native / SwiftUI / Ionic	Elements with `uxcam-occlude` class or `type="password"`
Flutter	None by default (requires wrapper)
Jetpack Compose	None (requires manual setup)

Dashboard Configuration (Recommended)

Configure occlusion rules without code changes via App Settings > Video Recording Privacy:

Global rules: Record, occlude, or blur all screens
Screen-specific rules: Different rules per screen
Text field occlusion: Hide all inputs on selected screens

Requires: iOS 3.6.0+, Android 3.6.0+, Flutter 2.3.1+, React Native 5.4.6+

SDK API Reference

Apply Overlay

Covers the screen with a solid color. Sensitive content is never recorded.

UXCamOverlay overlay = new UXCamOverlay.Builder()
    .withoutGesture(false)  // true = hide gestures (default)
    .screens(Arrays.asList("Screen1"))  // optional
    .build();
UXCam.applyOcclusion(overlay);
UXCam.removeOcclusion(overlay);

let overlay = UXCamOverlaySetting(color: .yellow)
UXCam.applyOcclusion(overlay)
UXCam.removeOcclusion(of: .overlay)

FlutterUXOverlay overlay = FlutterUXOverlay(color: Colors.red, hideGestures: true);
FlutterUxcam.applyOcclusion(overlay);
FlutterUxcam.removeOcclusion(overlay);

const overlay = { type: UXCamOcclusionType.Overlay, color: 0xff00ee, hideGestures: true };
RNUxcam.applyOcclusion(overlay);
RNUxcam.removeOcclusion(overlay);

UXCamCore.applyOcclusion(OverlaySetting())
UXCamCore.removeOcclusion()

UXCam.applyOcclusion(new UXCamOverlaySetting(UIColor.Yellow));

UXCam.applyOcclusion({ type: UXCamOcclusionType.Overlay, color: 0xff00ee });

Parameters:

Parameter	Type	Description
`color`	Color	Overlay color
`hideGestures` / `withoutGesture`	Boolean	Hide gesture recording (default: true)
`screens`	List	Apply to specific screens only
`excludeMentionedScreens`	Boolean	If true, apply to all screens except listed ones

Apply Blur

Blurs the screen while preserving layout visibility. Useful for maintaining context without exposing details.

UXCamBlur blur = new UXCamBlur.Builder()
    .blurRadius(10)  // default 20
    .withoutGesture(false)
    .build();
UXCam.applyOcclusion(blur);

let blur = UXCamBlurSetting(radius: 5)
UXCam.applyOcclusion(blur)
UXCam.removeOcclusion(of: .blur)

FlutterUXBlur blur = FlutterUXBlur(blurRadius: 10, blurType: BlurType.gaussian);
FlutterUxcam.applyOcclusion(blur);

const blur = { type: UXCamOcclusionType.Blur, blurRadius: 20, hideGestures: true };
RNUxcam.applyOcclusion(blur);

UXCamCore.applyOcclusion(BlurSetting())

UXCam.applyOcclusion(new UXCamBlurSetting(10));

UXCam.applyOcclusion({ type: 3, blurRadius: 20 });

Parameters:

Parameter	Type	Description
`blurRadius`	Integer	Blur strength (higher = more blur)
`hideGestures`	Boolean	Hide gesture recording (default: true)
`screens`	List	Apply to specific screens only

Occlude All Text Fields

Hides all text input fields on screen.

UXCam.applyOcclusion(new UXCamOccludeAllTextFields());

UXCam.applyOcclusion(UXCamOccludeAllTextFields())

Not supported - use OccludeWrapper instead

RNUxcam.applyOcclusion({ type: UXCamOcclusionType.OccludeAllTextFields });

UXCamCore.applyOcclusion(OccludeAllTextFields())

UXCam.applyOcclusion(new UXCamOccludeAllTextFields());

Occlude Sensitive View

Hides specific UI elements containing sensitive data.

UXCam.occludeSensitiveView(View sensitiveView);

UXCam.occludeSensitiveView(sensitiveView)

OccludeWrapper(child: YourSensitiveWidget())

<Button ref={view => RNUxcam.occludeSensitiveView(view)} />

Text("Sensitive").uxcamOcclude()
Text("With gestures").uxcamOcclude(blockGestures: false)

UXCam.OccludeSensitiveView(sensitiveView);

<input class="uxcam-occlude" type="text" />

Configuration Object Setup

Apply multiple occlusions at SDK initialization:

UXConfig config = new UXConfig.Builder(appKey)
    .occlusions(Arrays.asList(blur, overlay, textFields))
    .build();
UXCam.startWithConfiguration(config);

let occlusion = UXCamOcclusion()
occlusion.apply(blurSetting, screens: ["LoginViewController"])
configuration.occlusion = occlusion
UXCam.start(with: configuration)

FlutterUxConfig config = FlutterUxConfig(userAppKey: "KEY", occlusions: [blur, overlay]);
FlutterUxcam.startWithConfiguration(config);

RNUxcam.startWithConfiguration({ userAppKey: 'KEY', occlusions: [overlay, blur] });

Platform Implementation Guides

For detailed implementation guides with best practices and troubleshooting:

Platform	Guide
Android	Sensitive Data Occlusion
iOS	Sensitive Data Occlusion
Flutter	Sensitive Data Occlusion
React Native	Sensitive Data Occlusion
Cordova	Sensitive Data Occlusion

Occlusion Priority Order

When multiple rules apply, priority is (highest to lowest):

Dashboard: Screen-specific overlay
Dashboard: Screen-specific blur
Dashboard: Global blur/overlay
SDK: Screen-specific overlay
SDK: Screen-specific blur
SDK: Global blur/overlay