FloatingParticipantView
FloatingParticipantView displays the local video stream of the local participant. It is a floating view that can be dragged in the call area.
When the video is muted, the video muted icon is shown in a disabled background.
General Usage
In order to use the FloatingParticipantView as a standalone component, you should use the following code:
import {
FloatingParticipantView,
useCallStateHooks,
} from '@stream-io/video-react-native-sdk';
const App = () => {
const { useLocalParticipant } = useCallStateHooks();
const localParticipant = useLocalParticipant();
return <FloatingParticipantView participant={localParticipant} />;
};
Props
alignment
Determines where the floating participant video will be placed initially.
| Type | Default value |
|---|---|
top-left |top-right|bottom-left|bottom-right | top-right |
participant
The participant to be rendered in the FloatingParticipantView.
| Type |
|---|
StreamVideoParticipant|undefined |
onPressHandler
Handler used to handle actions on click of the participant view in FloatingParticipantView.
| Type |
|---|
() => void | undefined |
style
This prop is used to override the root container style of the component.
| Type |
|---|
| ViewStyle |
videoZOrder
The zOrder for the video that will be displayed.
| Type | Default Value |
|---|---|
number | 0 |
objectFit
Represents how the video view fits within the parent view.
| Type | Default Value |
|---|---|
'contain' | 'cover' |undefined | cover |
ParticipantLabel
Component to customize the Label of the participant.
| Type | Default Value |
|---|---|
ComponentType| undefined | ParticipantLabel |
ParticipantReaction
Component to customize the component that displays the reaction of the participant.
| Type | Default Value |
|---|---|
ComponentType| undefined | ParticipantReaction |
ParticipantNetworkQualityIndicator
Component to customize the network quality indicator of the participant.
| Type | Default Value |
|---|---|
ComponentType| undefined | ParticipantNetworkQualityIndicator |
ParticipantVideoFallback
Component to customize the video fallback of the participant, when the video is disabled.
| Type | Default Value |
|---|---|
ComponentType| undefined | ParticipantVideoFallback |
ParticipantView
Prop to customize the ParticipantView component entirely.
| Type | Default Value |
|---|---|
ComponentType| undefined | ParticipantView |
VideoRenderer
Component to customize the video component of the participant. It is also responsible to display the ParticipantVideoFallback.
| Type | Default Value |
|---|---|
ComponentType| undefined | VideoRenderer |