Screen Sharing

Our Video SDK provides an easy ways to enable screensharing in your application. In the following examples, we would learn to control and configure screen sharing.

Screen Sharing is supported only on Desktop browsers. For more details, please refer to the Browser Compatibility section.

For a user to be able to share their screen, they must have the screenshare capability (provided through the Screenshare permission) configured for the call they are in.

Screen sharing can be enabled or disabled on the dashboard for your call type:

Screenshot shows screensharing dashboard setting

await call.screenShare.toggle();

// or
await call.screenShare.enable();
await call.screenShare.disable();

// alternatively
import { useCallStateHooks } from '@stream-io/video-react-sdk';

const { useScreenShareState } = useCallStateHooks();
const { screenShare } = useScreenShareState();
await screenShare.toggle();

Here is how you can access the status of screen sharing:

import { useCallStateHooks } from '@stream-io/video-react-sdk';

call.screenShare.state.status; // enabled, disabled or undefined

// or, if you want to subscribe to changes
const { useScreenShareState } = useCallStateHooks();
const { status } = useScreenShareState();

console.log('Screen sharing is:', status === 'enabled' ? 'active' : 'inactive');

The behavior of the screen share video track can be customized, and a few parameters can be set:

call.screenShare.setSettings({
  maxFramerate: 15, // will be clamped between 1 and 15 fps
  maxBitrate: 1500000, // will use at most 1.5Mbps
});

await call.screenShare.enable();

Our SDK provided ParticipantView component can automatically render the screen share video track.

// enable it
call.screenShare.enableScreenShareAudio();

// publish video and audio (if available, and supported by the browser)
await call.screenShare.enable();

// disable it
call.screenShare.disableScreenShareAudio();

Our SDK provided ParticipantView component can automatically play the screen share audio track.

Caveats

Screen Share Audio has limited support across browsers and platforms. For most up-to-date information, please take a look at Browser Compatibility.

In addition to that, there are a few caveats that you should be aware of:

On Windows, the entire system audio can be captured, but on MacOS and Linux, only the audio of a tab can be captured.

Localization

Joining a call from a link (Deeplinking)