VideoTileProps interface
Props for VideoTile.
Properties
| children | React Child components. Child Components will show as overlay component in the VideoTile. |
| display |
Display Name of the Participant to be shown in the label. |
| initials |
Name of the participant used to generate initials. For example, a name |
| is |
Determines if the video is mirrored or not. |
| is |
Whether the video is muted or not. |
| is |
Whether the participant in the videoTile is speaking. Shows a speaking indicator (border). |
| no |
Optional property to set the aria label of the video tile if there is no available stream. |
| on |
Custom render Component function for no video is available. Render a Persona Icon if undefined. |
| persona |
Maximum size of the personal avatar in px. The persona avatar is the default placeholder shown when no video stream is available. For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona |
| persona |
Minimum size of the persona avatar in px. The persona avatar is the default placeholder shown when no video stream is available. For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona |
| render |
Component with the video stream. |
| show |
Show label on the VideoTile |
| show |
Whether to display a mute icon beside the user's display name. |
| styles | Allows users to pass in an object contains custom CSS styles. |
| user |
user id for the VideoTile placeholder. |
Property Details
children
React Child components. Child Components will show as overlay component in the VideoTile.
children?: ReactNodeProperty Value
ReactNode
displayName
Display Name of the Participant to be shown in the label.
displayName?: stringProperty Value
string
Remarks
displayName is used to generate avatar initials if initialsName is not provided.
initialsName
Name of the participant used to generate initials. For example, a name John Doe will display JD as initials.
initialsName?: stringProperty Value
string
Remarks
displayName is used if this property is not specified.
isMirrored
Determines if the video is mirrored or not.
isMirrored?: booleanProperty Value
boolean
isMuted
Whether the video is muted or not.
isMuted?: booleanProperty Value
boolean
isSpeaking
Whether the participant in the videoTile is speaking. Shows a speaking indicator (border).
isSpeaking?: booleanProperty Value
boolean
noVideoAvailableAriaLabel
Optional property to set the aria label of the video tile if there is no available stream.
noVideoAvailableAriaLabel?: stringProperty Value
string
onRenderPlaceholder
Custom render Component function for no video is available. Render a Persona Icon if undefined.
onRenderPlaceholder?: OnRenderAvatarCallbackProperty Value
personaMaxSize
Maximum size of the personal avatar in px. The persona avatar is the default placeholder shown when no video stream is available. For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona
personaMaxSize?: numberProperty Value
number
personaMinSize
Minimum size of the persona avatar in px. The persona avatar is the default placeholder shown when no video stream is available. For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona
personaMinSize?: numberProperty Value
number
renderElement
Component with the video stream.
renderElement?: null | ElementProperty Value
null | Element
showLabel
Show label on the VideoTile
showLabel?: booleanProperty Value
boolean
showMuteIndicator
Whether to display a mute icon beside the user's display name.
showMuteIndicator?: booleanProperty Value
boolean
styles
Allows users to pass in an object contains custom CSS styles.
styles?: VideoTileStylesPropsProperty Value
userId
user id for the VideoTile placeholder.
userId?: stringProperty Value
string