Barcode AR Responsive Annotation

Defined under the namespace Scandit.Datacapture.Barcode.Ar.Ui

BarcodeArResponsiveAnnotation

class BarcodeArResponsiveAnnotation : ScanditHTMLElement, BarcodeArAnnotation

Added in version 7.5.0

Responsive annotations dynamically switch between different annotation variations based on the barcode’s size relative to the screen. This allows for different display styles as a barcode gets closer to or further from the camera.

Each variation is gated by an area-ratio upper bound (the barcode area as a percentage of the screen area). The variations are evaluated from far to close, and the one whose upper bound is the first at or above the current ratio is displayed.

Each variation is a BarcodeArAnnotation — an info, popover, or status icon annotation, or a custom annotation — and any can be set to null to display nothing in that range.

Note

Passing a BarcodeArResponsiveAnnotation as a variation of another BarcodeArResponsiveAnnotation is undefined behavior and is not supported.

Note

A BarcodeArPopoverAnnotation is not fully supported as a variation. BarcodeArView only applies popover-specific handling — backdrop, exclusive visibility, tap routing — to a popover the annotation provider returns directly, so a popover used as a variation does not receive it, and while such a popover is displayed the backdrop of an unrelated top-level popover can stay visible after that popover is dismissed.

Note

A variation must lay out in the normal flow of its responsive annotation. A variation positioned with position: absolute or position: fixed leaves the responsive annotation with no size of its own, which places the variation incorrectly.

Note

The responsive annotation takes its annotationTrigger from the variation covering the closest range, and BarcodeArView reads that trigger once. Set annotationTrigger on the responsive annotation itself, which applies it to every variation, when the variations do not all default to the same trigger.

create(barcode, annotationsByThreshold)

static create(barcode: Barcode,
        annotationsByThreshold: Record<number, BarcodeArAnnotation | null>): BarcodeArResponsiveAnnotation

Added in version 8.6.0

Constructs a new responsive annotation whose displayed variation depends on the barcode’s area relative to the view. Each key is the area-ratio upper bound (in the range (0.0, 1.0]) at or below which the associated annotation is shown; ranges are evaluated from far to close. A key of 1.0 covers the entire view, so include one to cover the closest range. A null value suppresses the annotation in that range, and keys outside (0.0, 1.0] are ignored.

create(barcode, closeUp, farAway)

static create(barcode: Barcode,
        closeUp: BarcodeArAnnotation | null,
        farAway: BarcodeArAnnotation | null): BarcodeArResponsiveAnnotation

Added in version 7.5.0

Constructs a new responsive annotation with the given barcode and annotation variations.

Deprecated since version 8.6: Replaced by create with an annotationsByThreshold map, which supports any number of distance-based variations.

updatePosition(point, transformOrigin, rotationAngle)

updatePosition(point: Point,
        transformOrigin: Point,
        rotationAngle: number): void

Added in version 7.5.0

Updates the position of the element with the given point, transform origin based on the anchor if any. RotationAngle is the angle of the barcode.

Example of updating the position of the annotation:

updatePosition(point, transformOrigin, rotationAngle) {
  this.style.transform = `translate3d(calc(${Math.round(point.x)}px + ${transformOrigin.x}%), calc(${Math.round(
    point.y
  )}px + ${transformOrigin.y}%), 0px) rotate(${rotationAngle}deg)`;
}

threshold

static threshold: number

Added in version 7.5.0

The threshold (percentage of the barcode area vs screen area) that determines when to display close-up vs far-away annotations.

The value should be between 0.0 and 1.0, where 0.1 represents 10% of the screen area.

The default value is 0.1.

Note

The threshold is a class-level property that applies to all instances of BarcodeArResponsiveAnnotation.

Deprecated since version 8.6: Configure per-instance distance ranges with the create annotationsByThreshold map instead.

barcode

get barcode(): Barcode

Added in version 7.5.0

The barcode instance for the annotation.

annotationTrigger

annotationTrigger: BarcodeArAnnotationTrigger

Added in version 7.5.0

The trigger that causes the annotation to be presented. By default is BarcodeArAnnotationTrigger.HighlightTapAndBarcodeScan.