Documentation
Low_Latency_Live Live Streaming
Documentation
Demo APP
SDK Center
API Center
FAQ
Code Market
Console
Sign Up
Log In
中文站 English
  • Documentation
  • Live Streaming
  • Upgrade the livestream
  • Advanced features
  • Enhance the livestream
  • Watermark the live
  • Take snapshots

Watermark the video/Take snapshots

Last updated:2023-05-17 19:00

Introduction

ZEGOCLOUD's SDKs provide the ability to watermark your video stream. For example, businesses and organizations can use the watermark feature to display their logo on the video.

This document mainly describes how to implement the watermark and screenshot features with the Video Call SDK.

Prerequisites

Before implementing the watermark and screenshot features, make sure you complete the following steps:

  • A project has been created in ZEGOCLOUD Console and applied for a valid AppID and AppSign. For details, please refer to Console - How to view project information .
  • ZEGO Express SDK has been integrated into the project to implement basic real-time audio and video functions. For details, please refer to Integrate the SDK and Implement a basic video call.

Using stream watermark

Images in "JPG" and "PNG" formats (i.e., image files with subfixes ".jpg", ".jpeg", and ".png") can be used as watermarks.

Currently, the imageURL parameter in the ZegoWatermark object supports the following two path formats:

  1. Accessing the image in the Bundle via the absolute path

    file://[the absolute path of the image in the bundle]: If the image is stored somewhere in the Bundle, you obtain the absolute path of the image in the bundle through the pathForResource:ofType: method of NSBundle. The imageURL should start with a prefix file:// followed by the absolute path of the image in the bundle.

    watermark-bundle
```objc
ZegoWatermark *watermark = [[ZegoWatermark alloc] init];

NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"ZegoLogo" ofType:@"png"];
watermark.imageURL = [NSString stringWithFormat:@"file://%@", imagePath];

watermark.layout = CGRectMake(0, 0, 200, 200);

[self.engine setPublishWatermark:watermark isPreviewVisible:YES];
```
  1. Accessing the image in the Assets directory of the iOS project

    asset://[image file name]: The image is must be stored in Assets.xcassets of the iOS project.

    watermark-assets
```objc
ZegoWatermark *watermark = [[ZegoWatermark alloc] init];
watermark.imageURL = @"asset://ZegoLogo";
watermark.layout = CGRectMake(0, 0, 200, 200);
[self.engine setPublishWatermark:watermark isPreviewVisible:YES];
```

Using snapshot feature

  1. To take a snapshot of the published images, call the takePublishStreamSnapshot method.
[[ZegoExpressEngine sharedEngine] takePublishStreamSnapshot:^(int errorCode, UIImage * _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;

            }
}];
  1. To take a snapshot of the played images, call the takePlayStreamSnapshot method.
[[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 set the layout property of the ZegoWatermark object?

    The watermark area cannot exceed the size set by the encoding resolution of the stream.

    For more details about the encoding resolution of the stream, refer to the setVideoConfig method.

Page Directory
  • Free trial
  • 提交工单
    咨询集成、功能及报价等问题
    电话咨询
    400 1006 604
    Get Consulting
    Scan Wechat QR code