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.

   Kotlin

   Java

   // To check if annotation feature is supported
   ZoomVideoSDK.instance.shareHelper.isAnnotationFeatureSupported
   
   // If you are the share owner, you can check if your viewer has annotation rights.
   ZoomVideoSDK.instance.shareHelper.isViewerAnnotationDisabled
   
   // If you are the share owner, you can enable or disable your viewer from annotation rights.
   ZoomVideoSDK.instance.shareHelper.disableViewerAnnotation(true/false)
   

   If it is supported, continue.

2. Set up screen sharing.

3. Include the zm-annoter.aar feature library in your main project. See Feature libraries for details.

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 ZoomVideoSDKAnnotationHelper from the share helper.

// Same as before, get the user's share canvas that you want to subscribe to
val userShareCanvas: ZoomVideoSDKVideoCanvas
// Set video aspect.
val videoAspect = ZoomVideoSDKVideoAspect.ZoomVideoSDKVideoAspect_PanAndScan
// Render the user's share stream into your view of choice. (This view is required for annotation)
userShareCanvas.subscribe(view, videoAspect, ZoomVideoSDKVideoResolution.ZoomVideoSDKResolution_Auto)

// Create annotation helper using the same view as before and check for permission again
val annotationHelper = ZoomVideoSDK.getInstance().getShareHelper().createAnnotationHelper(view) // Create annotation helper using the same view as before and check for permission again
if (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
ZoomVideoSDKVideoCanvas userShareCanvas;
// Set video aspect.
ZoomVideoSDKVideoAspect videoAspect = ZoomVideoSDKVideoAspect.ZoomVideoSDKVideoAspect_PanAndScan;
// Render the user's share stream into your view of choice. (This view is required for annotation)
usersShareCanvas.subscribe(view, ZoomVideoSDKVideoAspect.ZoomVideoSDKVideoAspect_PanAndScan, ZoomVideoSDKVideoResolution.ZoomVideoSDKResolution_Auto);

// Create annotation helper using the same view as before and check for permission again
ZoomVideoSDKAnnotationHelper annotationHelper = ZoomVideoSDK.getInstance().getShareHelper().createAnnotationHelper(view);
if (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 ZoomVideoSDKAnnotationToolType.

// Enum of ZoomVideoSDKAnnotationToolType
ZoomVideoSDKAnnotationToolType_Arrow,
ZoomVideoSDKAnnotationToolType_AutoArrow,
ZoomVideoSDKAnnotationToolType_AutoDiamond,
ZoomVideoSDKAnnotationToolType_AutoDoubleArrow,
ZoomVideoSDKAnnotationToolType_AutoEllipse,
ZoomVideoSDKAnnotationToolType_AutoEllipseFill,
ZoomVideoSDKAnnotationToolType_AutoEllipseSemiFill,
ZoomVideoSDKAnnotationToolType_AutoLine,
ZoomVideoSDKAnnotationToolType_AutoRectangle,
ZoomVideoSDKAnnotationToolType_AutoRectangleFill,
ZoomVideoSDKAnnotationToolType_AutoRectangleSemiFill,
ZoomVideoSDKAnnotationToolType_AutoStampArrow,
ZoomVideoSDKAnnotationToolType_AutoStampCheck,
ZoomVideoSDKAnnotationToolType_AutoStampHeart,
ZoomVideoSDKAnnotationToolType_AutoStampQm,
ZoomVideoSDKAnnotationToolType_AutoStampStar,
ZoomVideoSDKAnnotationToolType_AutoStampX,
ZoomVideoSDKAnnotationToolType_ERASER,
ZoomVideoSDKAnnotationToolType_HighLighter,
ZoomVideoSDKAnnotationToolType_None,
ZoomVideoSDKAnnotationToolType_Pen,
ZoomVideoSDKAnnotationToolType_Picker,
ZoomVideoSDKAnnotationToolType_SpotLight

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(ZoomVideoSDKAnnotationToolType.ZoomVideoSDKAnnotationToolType_Pen)

// Get/set tool's color - int
annotationHelper.getToolColor()
annotationHelper.setToolColor(value)

// Get/set tool's width - long
annotationHelper.getToolWidth()
annotationHelper.setToolWidth(value)

// Get/set tool type
annotationHelper.getToolType();
annotationHelper.setToolType(ZoomVideoSDKAnnotationToolType.ZoomVideoSDKAnnotationToolType_Pen);

// Get/set tool's color - UIColor
annotationHelper.getToolColor();
annotationHelper.setToolColor(value);

// Get/set tool's width - UInt
annotationHelper.getToolWidth();
annotationHelper.setToolWidth(value);

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(ZoomVideoSDKAnnotationClearType.All) // .all, .my, .others

annotationHelper.undo();
annotationHelper.redo();
annotationHelper.clear(ZoomVideoSDKAnnotationClearType.ZoomVideoSDKAnnotationClearType_All); // .all, .my, .others

Destroy annotation#

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

ZoomVideoSDK.getInstance().getShareHelper().destroyAnnotationHelper(annotationHelper)

ZoomVideoSDK.getInstance().getShareHelper().destroyAnnotationHelper(annotationHelper);