Share Your Screen
Whenever any participant wants to share mobile screen, they can simply do it with VideoSDK Meeting.
For Mobile Devices a complete screen will be share.
This guide will provide an overview of how to use enable and disable Screen Share in a meeting.
Enable Screen Share - By using
enableScreenShare()
function, a participant can publish screen stream to other participants.- You can pass customise screen share track in
enableScreenShare()
by using Custom Screen Share Track.
- You can pass customise screen share track in
Disable Screen Share - By using
disableScreenShare()
function, a participant can stop publishing screen stream to other participants.
Enable, Disable Screen Share
import { useMeeting } from "@videosdk.live/react-native-sdk";
const MeetingView = () => {
const { enableScreenShare, disableScreenShare, toggleScreenShare } =
useMeeting();
const onPress = () => {
// Enabling ScreenShare
enableScreenShare();
// Disabling ScreenShare
disableScreenShare();
// Toggle ScreenShare
toggleScreenShare();
};
return <>...</>;
};
For React Native iOS Screen Share feature, you need to follow this guide React Native iOS Screen Share
Events
Events associated with enableScreenShare()
:
Every Participant will receive a callback on
onStreamEnabled()
of theuseParticipant()
hook withStream
object.onPresenterChanged()
will also receive a callback with thepresenterId
.
Events associated with disableScreenShare()
:
Every Participant will receive a callback on
onStreamDisabled()
of theuseParticipant()
hook withStream
object.onPresenterChanged()
will also receive a callback withnull
value.
import { useParticipant } from "@videosdk.live/react-native-sdk";
function onStreamEnabled(stream) {
if(stream.kind === 'share'){
console.log("Screen Share Stream On: onStreamEnabled", stream);
}
}
function onStreamDisabled(stream) {
if(stream.kind === 'share'){
console.log("Screen Share Stream Off: onStreamDisabled", stream);
}
}
const {
displayName
...
} = useParticipant(participantId,{
onStreamEnabled,
onStreamDisabled,
...
});
import { useMeeting } from "@videosdk.live/react-native-sdk";
function onPresenterChanged(presenterId) {
console.log(" onPresenterChanged", presenterId);
}
const {
meetingId
...
} = useMeeting({
onPresenterChanged,
...
});
Got a Question? Ask us on discord