Data Capture View

Defined under the namespace Scandit.Datacapture.Core.Ui

DataCaptureView
class DataCaptureView

Added in version 6.1.0

The capture view is the main UI view to be used together with the data capture context for applications that wish to display a video preview together with additional augmentations such as barcode locations.

The data capture view itself only displays the preview and shows UI elements to control the camera, such as buttons to switch torch on and off, or a button to switch between front and back facing cameras. Augmentations, such as the locations of identified barcodes are provided by individual overlays. This view will also display errors in case something goes wrong with its context, see the ContextStatus for a list of possible errors.

Unless otherwise specified, methods and properties of this class should only be accessed from the main thread.

Related topics: Get Started With Barcode Capture, Get Started With MatrixScan, Core Concepts of the Scandit Data Capture SDK.

forContext(context)
static forContext(context: DataCaptureContext | null): DataCaptureView

Added in version 6.1.0

Initializes a new data capture view. When a data capture context is provided, the view is associated with the context.

The data capture context can be changed at a later point by setting the context property.

constructor()
constructor()

Added in version 6.1.0

Initializes a new data capture view. The context must be provided by setting the context property.

context
context: DataCaptureContext | null

Added in version 6.1.0

The data capture context of this capture view. This property must be set to an instance of the data capture context for this view to display anything.

When the capture context is attached to a data capture view, it is removed from any other data capture view it was attached to.

addOverlay(overlay)
addOverlay(overlay: DataCaptureOverlay): void

Added in version 6.1.0

Adds the overlay to this data capture view. If the overlay is already part of this view, the call has no effect.

removeOverlay(overlay)
removeOverlay(overlay: DataCaptureOverlay): void

Added in version 6.1.0

Removes overlay from this data capture view. If the overlay is not part of this view, the call has no effect.

addControl(control)
addControl(control: Control): void

Added in version 6.8.0

Adds the control to the data capture view. In case multiple controls get added, the order in which addControl() gets called determines how the controls are going to be laid out. If the control is already part of this view, the call has no effect.

addControlWithAnchorAndOffset(control, anchor, offset)
addControlWithAnchorAndOffset(control: Control,
        anchor: Anchor,
        offset: PointWithUnit): void

Added in version 6.22.0

Adds the control to the data capture view at the specified anchor and with the given offset. Only one control per type can be added at any point in time, trying to add a second instance of the same control type will result in the first one being removed. Adding a control at an anchor already taken will replace the previous control there. The offset x will move the control away from the border of the data capture view horizontally, which means that controls anchored on the left will move to the right and vice-versa. Controls anchored in the center horizontally will also move to the right. The offset y will move the control away from the border of the data capture view vertically, which means that controls anchored on the top will move downward and controls anchored to the bottom will move upward. Controls anchored in the center vertically will also move upward.

removeControl(control)
removeControl(control: Control): void

Added in version 6.8.0

Removes the previously added control from data capture view. If the control is not part of this view, the call has no effect.

addListener(listener)
addListener(listener: DataCaptureViewListener): void

Added in version 6.1.0

Adds the listener to this data capture view.

In case the same listener is already observing this instance, calling this method will not add the listener again.

removeListener(listener)
removeListener(listener: DataCaptureViewListener): void

Added in version 6.1.0

Removes a previously added listener from this data capture view.

In case the listener is not currently observing this instance, calling this method has no effect.

viewPointForFramePoint(point)
viewPointForFramePoint(point: Point): Promise<Point>

Added in version 6.1.0

Converts a point in the coordinate system of the last visible frame and maps it to a coordinate in the view.

This method is thread-safe and can be called from any thread.

viewQuadrilateralForFrameQuadrilateral(quadrilateral)
viewQuadrilateralForFrameQuadrilateral(quadrilateral: Quadrilateral): Promise<Quadrilateral>

Added in version 6.1.0

Converts a quadrilateral in the coordinate system of the last visible frame and maps it to a coordinate in the view.

scanAreaMargins
scanAreaMargins: MarginsWithUnit

Added in version 6.1.0

The margins to use for the scan area. The margins are measured from the border of the data capture view and allow to specify a region around the border that is excluded from scanning.

By default, the margins are zero and the scanning happens in the visible part of the preview.

pointOfInterest
pointOfInterest: PointWithUnit

Added in version 6.1.0

The point of interest of this data capture view. By default, the point of interest is centered in the data capture view. The point of interest is used to control the center of attention for the following subsystems:

  • Auto focus and exposure metering of the camera.

  • Location selections for capture modes that support them. When no location selection is set, the point of interest defines the location at which the recognition optimizes for reading codes/text/etc.

  • Rendered viewfinders.

The point of interest can be overwritten by individual capture modes such as BarcodeCapture. The overwriting point of interest only affects the center of the location selection and viewfinder of said mode, it does not affect the auto focus or exposure metering of the camera.

logoStyle
logoStyle: LogoStyle

Added in version 6.8.0

The style of the logo which can be either the default extended “Scanning By Scandit” or a minimal “Scandit”.

This property has no effect when the logo is drawn by one of the viewfinders.

logoAnchor
logoAnchor: Anchor

Added in version 6.1.0

The anchor point to use for positioning the “Scanning By Scandit” logo. By default the logo is placed in the lower-right corner of the scan area (Anchor.BottomRight).

To shift the logo relative to the anchor position, use the logoOffset property.

This property has no effect when the logo is drawn by one of the viewfinders.

logoOffset
logoOffset: PointWithUnit

Added in version 6.1.0

The offset applied to the “Scanning By Scandit” logo relative to the logo anchor. When specified in pixels (MeasureUnit.Pixel) or device-independent pixels (MeasureUnit.DIP), the offset is used as-is. When specified as a fraction (MeasureUnit.Fraction), the offset is computed relative to the view size minus the scan area margins. For example, a value of 0.1 for the x-coordinate will set the offset to be 10% of the view width minus the left and right margins.

This property has no effect when the logo is drawn by one of the viewfinders.

focusGesture
focusGesture: FocusGesture | null

Added in version 6.7.0

The gesture used to focus. Defaults to TapToFocus. Set to null if no focus gesture is desired.

zoomGesture
zoomGesture: ZoomGesture | null

Added in version 6.7.0

The gesture used to zoom. Defaults to SwipeToZoom. Set to null if no zoom gesture is desired.

connectToElement(element)
connectToElement(element: HTMLElement): void

Added in version 6.1.0

Connect the data capture view to a given HTML element, so it’s size and position can be mirrored.

To position the capture view below the WebView and show content over the camera preview, change the z-index of the element to be less than 0. If you do this, make sure that the background of your HTML page is transparent, so the capture view positioned under the WebView can be seen.

Note

Should not be used together with setFrame(). One strategy to size the capture view should be chosen.

detachFromElement()
detachFromElement(): void

Added in version 6.9.0

Detach the capture view from the currently connected HTML element. This releases the HTML element and removes any listeners or resources related to it.

setFrame(frame, isUnderContent)
setFrame(frame: Rect,
        isUnderContent: boolean): Promise<void>

Added in version 6.3.1

Manually set a specific size and position for the capture view.

To position the capture view below the WebView and show content over the camera preview, set the isUnderContent argument to true. If you do this, make sure that the background of your HTML page is transparent, so the capture view positioned under the WebView can be seen.

Note

Should not be used together with connectToElement(). One strategy to size the capture view should be chosen.

show()
show(): Promise<void>

Added in version 6.3.1

Set the view to be visible.

Should only be used with setFrame().

hide()
hide(): Promise<void>

Added in version 6.3.1

Set the view not to be visible.

Should only be used with setFrame().