Camera Frame

A frame is cropped by the camera frame. If you set the camera frame to full screen, Core will crop the frame by phone borders. Note that using this setting may lead to lower performance because of the huge frame size. Any changes connected to the camera frame alter the scanning process.

• To override the default cropping frame on the camera activity provided by the scenario, set:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.functionality.cameraFrame = DocReaderFrame.max

[RGLDocReader shared].functionality.cameraFrame = RGLDocReaderFrameMax;

DocumentReader.Instance().functionality().edit().setCameraFrame(DocReaderFrame.MAX).apply()

DocumentReader.Instance().functionality().edit().setCameraFrame(DocReaderFrame.MAX).apply();

DocumentReader.instance.functionality.cameraFrame = DocReaderFrame.MAX;

DocumentReader.setFunctionality({
    cameraFrame: Enum.DocReaderFrame.MAX
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setFunctionality({
    cameraFrame: Enum.DocReaderFrame.MAX
});

DocumentReader.setFunctionality({
    cameraFrame: Enum.DocReaderFrame.MAX
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Functionality().Edit().SetCameraFrame(DocReaderFrame.Max).Apply();

// iOS
RGLDocReader.Shared.Functionality.CameraFrame = RGLDocReaderFrame.Max;

• Set the thickness of the document borders in the video preview (in dp):

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameBorderWidth = 10

[RGLDocReader shared].customization.cameraFrameBorderWidth = 10;

DocumentReader.Instance().customization().edit().setCameraFrameBorderWidth(5).apply()

DocumentReader.Instance().customization().edit().setCameraFrameBorderWidth(5).apply();

DocumentReader.instance.customization.cameraFrameBorderWidth = 20;

DocumentReader.setCustomization({
    cameraFrameBorderWidth: 20,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameBorderWidth: 20
});

DocumentReader.setCustomization({
    cameraFrameBorderWidth: 20,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameBorderWidth((Java.Lang.Integer)10).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameBorderWidth = 10;

• Set the hex color code for the document borders in the default state:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameDefaultColor = UIColor.red

[RGLDocReader shared].customization.cameraFrameDefaultColor = [UIColor redColor];

DocumentReader.Instance().customization().edit().setCameraFrameDefaultColor("#ff0000").apply()

DocumentReader.Instance().customization().edit().setCameraFrameDefaultColor("#ff0000").apply();

DocumentReader.instance.customization.cameraFrameDefaultColor = Colors.red;

DocumentReader.setCustomization({
    cameraFrameDefaultColor: 0xffff0000,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameDefaultColor: 0xffff0000
});

DocumentReader.setCustomization({
    cameraFrameDefaultColor: 0xffff0000,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameDefaultColor("#ff0000").Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameDefaultColor = UIColor.Red;

• Set the hex color code for the document border in the document detected state:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameActiveColor = UIColor.purple

[RGLDocReader shared].customization.cameraFrameActiveColor = [UIColor purpleColor];

DocumentReader.Instance().customization().edit().setCameraFrameActiveColor("#c300ff").apply()

DocumentReader.Instance().customization().edit().setCameraFrameActiveColor("#c300ff").apply();

DocumentReader.instance.customization.cameraFrameActiveColor = Colors.purple;

DocumentReader.setCustomization({
    cameraFrameActiveColor: 0xffc300ff,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameActiveColor: 0xffc300ff
});

DocumentReader.setCustomization({
    cameraFrameActiveColor: 0xffc300ff,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameActiveColor("#ca7afd").Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameActiveColor = UIColor.Purple;

• Define the shape of document borders:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameShapeType = CameraFrameShapeType.corners

[RGLDocReader shared].customization.cameraFrameShapeType = RGLCameraFrameShapeTypeCorners;

DocumentReader.Instance().customization().edit().setCameraFrameShapeType(FrameShapeType.CORNER).apply()

DocumentReader.Instance().customization().edit().setCameraFrameShapeType(FrameShapeType.CORNER).apply();

DocumentReader.instance.customization.cameraFrameShapeType = FrameShapeType.CORNER;

DocumentReader.setCustomization({
    cameraFrameShapeType: Regula.DocumentReader.Enum.FrameShapeType.CORNER,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameShapeType: Enum.FrameShapeType.CORNER
});

DocumentReader.setCustomization({
    cameraFrameShapeType: DocumentReader.Enum.FrameShapeType.CORNER,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameShapeType((Java.Lang.Integer)FrameShapeType.Corner).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameShapeType = RGLCameraFrameShapeType.Corners;

• Define the length of the corner side in the corners shape mode (in dp):

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameLineLength = 25

[RGLDocReader shared].customization.cameraFrameLineLength = 25;

DocumentReader.Instance().customization().edit().setCameraFrameLineLength(50).apply()

DocumentReader.Instance().customization().edit().setCameraFrameLineLength(50).apply();

DocumentReader.instance.customization.cameraFrameLineLength = 20;

DocumentReader.setCustomization({
    cameraFrameLineLength: 20,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameLineLength: 20
});

DocumentReader.setCustomization({
    cameraFrameLineLength: 20,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameLineLength((Java.Lang.Integer)25).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameLineLength = 25;

• Change the corners' radius of the camera frame:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameCornerRadius = 10

[RGLDocReader shared].customization.cameraFrameCornerRadius = 10;

DocumentReader.Instance().customization().edit().setCameraFrameCornerRadius(10.0F).apply()

DocumentReader.Instance().customization().edit().setCameraFrameCornerRadius(10.0F).apply();

DocumentReader.instance.customization.cameraFrameCornerRadius = 10;

DocumentReader.setCustomization({
    cameraFrameCornerRadius: 10,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameCornerRadius: 10
});

DocumentReader.setCustomization({
    cameraFrameCornerRadius: 10,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameCornerRadius((Java.Lang.Float)10.0F).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameCornerRadius = 10;

• Customize the beginning and ending of stroked lines of the camera frame:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameLineCap = CGLineCap.round

[RGLDocReader shared].customization.cameraFrameLineCap = kCGLineCapRound;

DocumentReader.Instance().customization().edit().setCameraFrameLineCap(Paint.Cap.ROUND).apply()

DocumentReader.Instance().customization().edit().setCameraFrameLineCap(Paint.Cap.ROUND).apply();

DocumentReader.instance.customization.cameraFrameLineCap = Cap.ROUND;

DocumentReader.setCustomization({
    cameraFrameLineCap: Regula.DocumentReader.Enum.LineCap.Round,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameLineCap: Enum.LineCap.Round
});

DocumentReader.setCustomization({
    cameraFrameLineCap: DocumentReader.Enum.LineCap.ROUND,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameLineCap(Paint.Cap.Round).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameLineCap = CoreGraphics.CGLineCap.Round;

• Specify the offsetWidth for the camera frame (only for the portrait orientation):

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameOffsetWidth = 50

[RGLDocReader shared].customization.cameraFrameOffsetWidth = 50;

DocumentReader.Instance().customization().edit().setCameraFrameOffsetWidth(50).apply()

DocumentReader.Instance().customization().edit().setCameraFrameOffsetWidth(50).apply();

DocumentReader.instance.customization.cameraFrameOffsetWidth = 50;

DocumentReader.setCustomization({
    cameraFrameOffsetWidth: 50,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameOffsetWidth: 50
});

DocumentReader.setCustomization({
    cameraFrameOffsetWidth: 50,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameOffsetWidth((Java.Lang.Integer)50).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameOffsetWidth = 50;

• Change the aspect ratio of the camera frame for portrait mode:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFramePortraitAspectRatio = 1.0

[RGLDocReader shared].customization.cameraFramePortraitAspectRatio = 1.0;

DocumentReader.Instance().customization().edit().setCameraFramePortraitAspectRatio(1.0F).apply()

DocumentReader.Instance().customization().edit().setCameraFramePortraitAspectRatio(1.0F).apply();

DocumentReader.instance.customization.cameraFramePortraitAspectRatio = 1;

DocumentReader.setCustomization({
    cameraFramePortraitAspectRatio: 1.0,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFramePortraitAspectRatio: 1.0
});

DocumentReader.setCustomization({
    cameraFramePortraitAspectRatio: 1.0,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFramePortraitAspectRatio((Java.Lang.Float)1.0F).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFramePortraitAspectRatio = 1.0F;

• Change the aspect ratio of the camera frame for landscape mode:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameLandscapeAspectRatio = 1.0

[RGLDocReader shared].customization.cameraFrameLandscapeAspectRatio = 1.0;

DocumentReader.Instance().customization().edit().setCameraFrameLandscapeAspectRatio(1.0F).apply()

DocumentReader.Instance().customization().edit().setCameraFrameLandscapeAspectRatio(1.0F).apply();

DocumentReader.instance.customization.cameraFrameLandscapeAspectRatio = 1;

DocumentReader.setCustomization({
    cameraFrameLandscapeAspectRatio: 1.0,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameLandscapeAspectRatio: 1.0
});

DocumentReader.setCustomization({
    cameraFrameLandscapeAspectRatio: 1.0,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameLandscapeAspectRatio((Java.Lang.Float)1.0F).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameLandscapeAspectRatio = 1.0F;

• Change the position of the camera frame to vertical:

SwiftObjective-C Kotlin Java Flutter React Native Ionic Cordova.NET MAUI

DocReader.shared.customization.cameraFrameVerticalPositionMultiplier = 0.5

[RGLDocReader shared].customization.cameraFrameVerticalPositionMultiplier = 0.5;

DocumentReader.Instance().customization().edit().setCameraFrameVerticalPositionMultiplier(0.5F).apply()

DocumentReader.Instance().customization().edit().setCameraFrameVerticalPositionMultiplier(0.5F).apply();

DocumentReader.instance.customization.cameraFrameVerticalPositionMultiplier = .5;

DocumentReader.setCustomization({
    cameraFrameVerticalPositionMultiplier: 0.5,
}, (str) => { console.log(str) }, (error) => { console.log(error) });

DocumentReader.setCustomization({
    cameraFrameVerticalPositionMultiplier: 0.5
});

DocumentReader.setCustomization({
    cameraFrameVerticalPositionMultiplier: 0.5,
}, function (m) { }, function (e) { console.log(e); });

// Android
DocumentReader.Instance().Customization().Edit().SetCameraFrameVerticalPositionMultiplier((Java.Lang.Float)0.5F).Apply();

// iOS
RGLDocReader.Shared.Customization.CameraFrameVerticalPositionMultiplier = 0.5F;

Next Steps

• Integration with Web API
• Optimize Your Application
• API Reference
• FAQ