UI configurations

DynamsoftCameraEnhancer library provides a series of UI configuring APIs for users to add basic UI elements.

View Classes

• CameraView: Display the captured video streaming and related UI elements.
• ImageEditorView: Display an image and editable UI elements.

Auxiliary APIs

• DrawingItem: The struct for you to draw basic UI elements.
• DrawingLayer: Container of DrawingItems. You can add multiple layer to a view.
• DrawingStyle: Defines the styles of the DrawingItems.

Highlight Results

Display Control

DynamsoftCameraEnhancer provides a layer for each Dynamsoft image processing product. You can switch the visible property of the layer to control whether to highlight the results.

Layers	Description
DDN_LAYER_ID	The preset DrawingLayer of Dynamsoft Document Normalizer.
DBR_LAYER_ID	The preset DrawingLayer of Dynamsoft Barcode Reader.
DLR_LAYER_ID	The preset DrawingLayer of Dynamsoft Label Recognizer.

For example, you can use the following code to highlight the barcode decoding results:

• Objective-C
• Swift

1. // Get the layer first.
   DSDrawingLayer *layer = [self.cameraView getDrawingLayer:DSDrawingLayerIdDBR];
   // Set the visible property to true or false to control the visibility.
   layer.visible = false;
   

2. // Get the layer first.
   layer = cameraView.getDrawingLayer(DrawingLayerId.DLR.rawValue)
   // Set the visible property to true or false to control the visibility.
   layer.visible = false
   

Change the Style

There are several preset styles definded in the DrawingStyleManager. You can directly specify the colour with the preset styles or create your own styles.

The follow code snippet shows how to specify preset styles:

• Objective-C
• Swift

1. // Change the style of the layer.
   [layer setDefaultStyle:DSDrawingStyleIdBlueStroke];
   // Set the default style of the layer with filter options.
   [layer setDefaultStyle:DSDrawingStyleIdOrangeStroke forState:DSDrawingItemStateSelected forType:DSDrawingItemMediaTypeQuadrilateral];
   

2. // Change the style of the layer.
   layer.setDefaultStyle(DrawingStyleId.blueStroke.rawValue)
   // Set the default style of the layer with filter options.
   layer?.setDefaultStyle(DrawingStyleId.blueStroke.rawValue, forState: DrawingItemState.default.rawValue, forType: DrawingItemMediaType.line.rawValue)
   

Create a use-defined style:

• Objective-C
• Swift

1. // Create a new DrawingStyle via the DrawingStyleManager.
   NSInteger userDefinedStyle = [DSDrawingStyleManager createDrawingStyle:UIColor.blueColor strokeWidth:2 fillColor:UIColor.blueColor textColor:UIColor.blueColor font:UIFontTextStyleTitle1];
   

2. // Create a new DrawingStyle via the DrawingStyleManager.
   let styleID = DrawingStyleManager.createDrawingStyle(UIColor.red, strokeWidth: 1, fill: UIColor.init(red: 255, green: 0, blue: 0, alpha: 0.1), textColor: UIColor.red, font:UIFont.systemFont(ofSize: 1) )
   

Add More Basic Graphics

A DrawingItem is the basic unit that you can draw on the view. It has different subclasses so that you can create DrawingItems in different shapes. Here we use QuadDrawingItem as an example to illustrate how to draw graphics on the view.

• Objective-C
• Swift

1. NSMutableArray<DSDrawingItem*>* items = [[NSMutableArray alloc] init];
   // Create an array of point
   // NSArray *pointArray = @[@(CGPointMake(0, 0)), ...];
   DSQuadrilateral *quad = [[DSQuadrilateral alloc] initWithPointArray:pointArray];
   DSQuadDrawingItem *item = [[DSQuadDrawingItem alloc] initWithQuadrilateral:quad];
   [items addObject:item];
   [layer setDrawingItems:items];
   

2. // Create a QuadDrawingItem
   // let quad = Quadrilateral.init(pointArray: [CGPoint(x: 0, y: 0), ...])
   let quadDrawingItem = QuadDrawingItem.init(quadrilateral: quad)
   layer?.drawingItems = [quadDrawingItem]