RtkParticipantTile

用于单个参会者的视频方块，显示其视频源、带有音频指示器的姓名标签、头像（当视频关闭时）以及固定指示器。

属性

属性	类型	必填	默认值	描述
`meeting`	`RealtimeKitClient`	✅	-	RealtimeKit 会议实例
`participant`	`RTKParticipant \| RTKSelf`	✅	-	要渲染的参会者
`config`	`UIConfig`	❌	`defaultConfig`	UI 配置对象
`style`	`StyleProp<any>`	❌	-	自定义样式（通常是用于网格调整大小的宽度/高度）
`nameTagPosition`	`'bottom-center' \| 'bottom-left' \| 'bottom-right' \| 'top-center' \| 'top-left' \| 'top-right' \| 'none'`	❌	`'bottom-left'`	姓名标签遮罩层的位置
`isPreview`	`boolean`	❌	`false`	是否为预览方块（设置页面）
`iconPack`	`IconPack`	❌	`defaultIconPack`	自定义图标包
`size`	`'lg' \| 'md' \| 'sm' \| 'xl'`	❌	`'sm'`	尺寸变体
`states`	`States`	❌	-	UI 状态对象
`t`	`RtkI18n`	❌	-	i18n 翻译函数
`children`	`ReactNode`	❌	-	叠加在方块上的额外内容

使用示例

基本用法

import { RtkParticipantTile } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
	return <RtkParticipantTile meeting={meeting} participant={participant} />;
}

带有属性

import { RtkParticipantTile } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
	return (
		<RtkParticipantTile
			meeting={meeting}
			participant={participant}
			nameTagPosition="bottom-left"
			isPreview={false}
			size="md"
		/>
	);
}