Annotation

Use annotation to draw over shared content. Both the user who is sharing and viewers can annotate during screen sharing.

Set up annotation

  1. Check if the annotation feature is supported.

    // Check if the annotation feature is supported.
    ZMVideoSDK.shared()?.getShareHelper()?.isAnnotationFeatureSupport()
    // If you are the share owner, you can check whether your viewer's annotation rights are disabled.
    ZMVideoSDK.shared()?.getShareHelper()?.isViewerAnnotationDisabled()
    // If you are the share owner, you can enable or disable your viewer's annotation rights.
    ZMVideoSDK.shared()?.getShareHelper()?.disableViewerAnnotation(true)
    
    ZMVideoSDKShareHelper *shareHelper = [[ZMVideoSDK sharedVideoSDK] getShareHelper];
    // Check if the annotation feature is supported.
    [shareHelper isAnnotationFeatureSupport];
    // If you are the share owner, you can check whether your viewer's annotation rights are disabled.
    [shareHelper isViewerAnnotationDisabled];
    // If you are the share owner, you can enable or disable your viewer's annotation rights.
    [shareHelper disableViewerAnnotation:YES];
    

    If it is supported, continue.

  2. Set up screen sharing.

    Now you can use annotation in your implementation.

Start and stop annotation

In order to start annotation, the viewer must first have already subscribed to a shared view and input the same view to create a new ZMVideoSDKAnnotationHelper from the share helper.

// Same as before, get the user's share canvas that you want to subscribe to.
let userShareCanvas: ZMVideoSDKVideoCanvas
// Render the user's share stream into your view of choice. (This view is required for annotation.)
userShareCanvas.subscribe(with: view, aspectMode: .panAndScan, resolution: .auto)
// Create the annotation helper using the same view above and check for permission again.
if let annotationHelper = ZMVideoSDK.shared()?.getShareHelper()?.createAnnotationHelper(view), annotationHelper.canDoAnnotation() {
    annotationHelper.startAnnotation()
    // To stop annotation later.
    annotationHelper.stopAnnotation()
}
// Same as before, get the user's share canvas that you want to subscribe to.
ZMVideoSDKVideoCanvas *userShareCanvas;
// Render the user's share stream into your view of choice. (This view is required for annotation.)
[userShareCanvas subscribeWithView:view aspectMode:ZMVideoSDKVideoAspect_PanAndScan resolution:ZMVideoSDKResolution_Auto];
// Create the annotation helper using the same view above and check for permission again.
ZMVideoSDKShareHelper *shareHelper = [[ZMVideoSDK sharedVideoSDK] getShareHelper];
ZMVideoSDKAnnotationHelper *annotationHelper = [shareHelper createAnnotationHelper:view];
if (annotationHelper && [annotationHelper canDoAnnotation]) {
    [annotationHelper startAnnotation];
    // To stop annotation later.
    [annotationHelper stopAnnotation];
}

Annotation tools

There are a list of annotation tools available. The full list of tools is located under ZMVideoSDKAnnotationToolType.

// Enum of ZMVideoSDKAnnotationToolType
ZMVideoSDKAnnotationToolType_None,
ZMVideoSDKAnnotationToolType_Pen,
ZMVideoSDKAnnotationToolType_HighLighter,
ZMVideoSDKAnnotationToolType_AutoLine,
ZMVideoSDKAnnotationToolType_AutoRectangle,
ZMVideoSDKAnnotationToolType_AutoEllipse,
ZMVideoSDKAnnotationToolType_AutoArrow,
ZMVideoSDKAnnotationToolType_AutoRectangleFill,
ZMVideoSDKAnnotationToolType_AutoEllipseFill,
ZMVideoSDKAnnotationToolType_SpotLight,
ZMVideoSDKAnnotationToolType_Arrow,
ZMVideoSDKAnnotationToolType_ERASER,
ZMVideoSDKAnnotationToolType_Textbox,
ZMVideoSDKAnnotationToolType_Picker,
ZMVideoSDKAnnotationToolType_AutoRectangleSemiFill,
ZMVideoSDKAnnotationToolType_AutoEllipseSemiFill,
ZMVideoSDKAnnotationToolType_AutoDoubleArrow,
ZMVideoSDKAnnotationToolType_AutoDiamond,
ZMVideoSDKAnnotationToolType_AutoStampArrow,
ZMVideoSDKAnnotationToolType_AutoStampCheck,
ZMVideoSDKAnnotationToolType_AutoStampX,
ZMVideoSDKAnnotationToolType_AutoStampStar,
ZMVideoSDKAnnotationToolType_AutoStampHeart,
ZMVideoSDKAnnotationToolType_AutoStampQm

Upon selecting the tool, the user can also get or set the current tool's color or width.

// Get/set tool type
annotationHelper.getToolType()
annotationHelper.setToolType(.pen)
// Get/set tool's color - Color
annotationHelper.getToolColor()
annotationHelper.setToolColor(.red)
// Get/set tool's width - long
annotationHelper.getToolWidth()
annotationHelper.setToolWidth(5)
// Get/set the tool type.
ZMVideoSDKAnnotationToolType toolType;
[annotationHelper getToolType:&toolType];
[annotationHelper setToolType:ZMVideoSDKAnnotationToolType_Pen];
// Get/set the tool's color.
NSColor *toolColor;
[annotationHelper getToolColor:&toolColor];
[annotationHelper setToolColor:[NSColor redColor]];
// Get/set the tool's width.
long toolWidth;
[annotationHelper getToolWidth:&toolWidth];
[annotationHelper setToolWidth:5];

Other annotation methods

You can also undo or redo annotations. And you can clear all annotations, just your own, or just others' annotations.

annotationHelper.undo()
annotationHelper.redo()
annotationHelper.clear(.all) // .all, .my, .others
[annotationHelper undo];
[annotationHelper redo];
[annotationHelper clear:ZMVideoSDKAnnotationClearType_All]; // _All, _My, _Others

For details, see the ZMVideoSDKAnnotationHelper class reference and the ZMVideoSDKShareHelper class reference.

Destroy annotation

Once annotation is no longer valid or required, you can destroy it by calling the destroyAnnotationHelper method in the ZMVideoSDKShareHelper class.

ZMVideoSDK.shared()?.getShareHelper()?.destroyAnnotationHelper(annotationHelper)
[[[ZMVideoSDK sharedVideoSDK] getShareHelper] destroyAnnotationHelper:annotationHelper];