videoStreamStyles

---

The Web Client SDK provides you with two types of styling options for video streams VideoStreamStyle.FIT_TO_VIEW and
VideoStreamStyle.SCALE_AND_CROP.

• VideoStreamStyle.FIT_TO_VIEW - In this type of styling option, videos maintain their aspect ratio with a clear space on the sides or top and bottom of the HTMLDivElement. This is the default style. 
• VideoStreamStyle.SCALE_AND_CROP - In this type, the video will be rendered with the default aspect ratio. However, the edges may be cropped when scaling within the provided HTMLDivElement.

VideoStreamStyle.SCALE_AND_CROP option ensures that the video feed  occupies the entire space of the provided  HTMLDivElement (which means no "pillar boxing", or "letterboxing").  When you select this option the video will be cropped and some section of your video not be shown, you can refer to the below snapshot.

The images above show how letter boxing and pillar boxing can look on fit to view and scale to crop styles.

setDefaultVideoStreamStyle

You can use the following code snippet to set the default video style to be a scale and crop.

webClientSDK.meetingService.videoStreamService.setVideoStreamStyle("SCALE_AND_CROP");

You can use the following code snippet to set the default video stream style as fit to view.

webClientSDK.meetingService.videoStreamService.setVideoStreamStyle("FIT_TO_VIEW");

Note

You should consider your layout and decide if cropping or letterboxing is better for your use case. You can also observe the resolution of the stream and resize the container accordingly.

setVideoStreamStyle

The video style will be set based on the videoStreamStyle parameter for the video element present in the provided view. If the video is removed from the provided view, the styles will be removed and the default video style will be used.

webClientSDK.meetingService.videoStreamService.setVideoStreamStyle("<VideoStreamStyle>", "<HTMLDivElement>");