Watermark and Screenshot

Feature Introduction

When you need to set copyright owner Logos for educational teaching courseware and other scenarios, you can use the SDK's watermark feature to achieve this.

This article mainly describes how to use the SDK to implement watermark and screenshot features.

Sample Source Code Download

Please refer to Download Sample Source Code to get the source code.

For related source code, please check the "/ZegoExpressExample/Examples/Others/Beautify" file.

Prerequisites

Before implementing watermark and screenshot features, please ensure:

• You have created a project in the ZEGOCLOUD Console and applied for a valid AppID and AppSign. For details, please refer to Console - Project Information.
• You have integrated the ZEGO Express SDK in the project and implemented basic audio and video publishing and playing functions. For details, please refer to Quick Start - Integration and Quick Start - Implementation Flow.

Usage Steps

Watermark

Call ZegoWatermark to configure a watermark image URL and the size and position of the watermark in the picture.

Call the setPublishWatermark interface to set the publishing watermark.

The imageURL parameter in the ZegoWatermark object supports two path formats: absolute path and Assets.

Absolute Path

file://[Absolute path of the image in Bundle]: You need to store the image in any location in the project Bundle, obtain the absolute path of the image through the pathForResource:ofType: method of NSBundle, and add the "file://" prefix.

ZegoWatermark *watermark = [[ZegoWatermark alloc] init];

NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"ZegoLogo" ofType:@"png"];
watermark.imageURL = [NSString stringWithFormat:@"file://%@", imagePath];
// The watermark layout uses the upper left corner as the origin of the coordinate system, and the area cannot exceed the size set by the encoding resolution. If empty, it means canceling the watermark
watermark.layout = CGRectMake(0, 0, 200, 200);
// Set watermark, supports dynamic modification before and after publishing
[self.engine setPublishWatermark:watermark isPreviewVisible:YES];

ZegoWatermark *watermark = [[ZegoWatermark alloc] init];

NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"ZegoLogo" ofType:@"png"];
watermark.imageURL = [NSString stringWithFormat:@"file://%@", imagePath];
// The watermark layout uses the upper left corner as the origin of the coordinate system, and the area cannot exceed the size set by the encoding resolution. If empty, it means canceling the watermark
watermark.layout = CGRectMake(0, 0, 200, 200);
// Set watermark, supports dynamic modification before and after publishing
[self.engine setPublishWatermark:watermark isPreviewVisible:YES];

Assets

asset://[Image resource name]: You need to store the image in "Assets.xcassets" that comes with the iOS project.

ZegoWatermark *watermark = [[ZegoWatermark alloc] init];
watermark.imageURL = @"asset://ZegoLogo";
// The watermark layout uses the upper left corner as the origin of the coordinate system, and the area cannot exceed the size set by the encoding resolution. If empty, it means canceling the watermark
watermark.layout = CGRectMake(0, 0, 200, 200);
// Set watermark, supports dynamic modification before and after publishing
[self.engine setPublishWatermark:watermark isPreviewVisible:YES];

ZegoWatermark *watermark = [[ZegoWatermark alloc] init];
watermark.imageURL = @"asset://ZegoLogo";
// The watermark layout uses the upper left corner as the origin of the coordinate system, and the area cannot exceed the size set by the encoding resolution. If empty, it means canceling the watermark
watermark.layout = CGRectMake(0, 0, 200, 200);
// Set watermark, supports dynamic modification before and after publishing
[self.engine setPublishWatermark:watermark isPreviewVisible:YES];

Screenshot

1. After publishing stream, call the takePublishStreamSnapshot interface to take a screenshot of the publishing stream picture.

   [[ZegoExpressEngine sharedEngine] takePublishStreamSnapshot:^(int errorCode, ZGImage * _Nullable image) {
   
       if (errorCode == ZegoErrorCodeCommonSuccess && image) {
           UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, UIScreen.mainScreen.bounds.size.width / 2, UIScreen.mainScreen.bounds.size.height / 2)];
           imageView.image = image;
           imageView.contentMode = UIViewContentModeScaleAspectFit;
       }
   }];

   [[ZegoExpressEngine sharedEngine] takePublishStreamSnapshot:^(int errorCode, ZGImage * _Nullable image) {
   
       if (errorCode == ZegoErrorCodeCommonSuccess && image) {
           UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, UIScreen.mainScreen.bounds.size.width / 2, UIScreen.mainScreen.bounds.size.height / 2)];
           imageView.image = image;
           imageView.contentMode = UIViewContentModeScaleAspectFit;
       }
   }];

2. After playing stream, call the takePlayStreamSnapshot interface to take a screenshot of the playing stream picture.

   [[ZegoExpressEngine sharedEngine] takePlayStreamSnapshot:self.streamID callback:^(int errorCode, ZGImage * _Nullable image) {
       if (errorCode == ZegoErrorCodeCommonSuccess && image) {
           UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, UIScreen.mainScreen.bounds.size.width / 2, UIScreen.mainScreen.bounds.size.height / 2)];
           imageView.image = image;
           imageView.contentMode = UIViewContentModeScaleAspectFit;
       }
   }];

   [[ZegoExpressEngine sharedEngine] takePlayStreamSnapshot:self.streamID callback:^(int errorCode, ZGImage * _Nullable image) {
       if (errorCode == ZegoErrorCodeCommonSuccess && image) {
           UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, UIScreen.mainScreen.bounds.size.width / 2, UIScreen.mainScreen.bounds.size.height / 2)];
           imageView.image = image;
           imageView.contentMode = UIViewContentModeScaleAspectFit;
       }
   }];

FAQ

1. How to specify the layout in ZegoWatermark?

   The watermark layout cannot exceed the currently set video encoding resolution for publishing. For setting the publishing encoding resolution, please refer to the setVideoConfig interface.