TUILiveKit 语聊房为纯音频直播场景提供了开箱即用的全功能界面。它支持快速搭建主播开播所需的核心能力,让您无需关注复杂的 UI 与麦位管理逻辑,即可高效集成语聊房开播流程。集成提示:
功能概览
开播前预览: 支持主播开播前设置房间名称、封面等个性化配置。
麦位管理: 支持上麦、下麦、禁麦、锁麦等多种麦位管理操作。
观众互动: 支持弹幕、礼物、点赞等丰富的直播互动形式。
直播间管理: 支持在线用户列表展示,以及直播间内的禁言、踢人等多种管理操作。
开播前预览 | 麦位管理 | 观众互动 | 直播间管理 |
![]() | ![]() | ![]() | ![]() |
快速接入
步骤1:开通服务
步骤2:代码集成
步骤3:添加主播页面
TUIVoiceRoomOverlay 已内置了语聊房场景的主播端完整 UI 与业务逻辑,支持浮窗模式。在直播期间,可以切换到应用内浮窗模式。TUIVoiceRoomOverlay是基于 Flutter 官方 API Overlay 实现的,具体接入流程如下:// 跳转到主播页面Navigator.push(context, MaterialPageRoute(builder: (context) {final roomId = "test_voice_room_id";final params = RoomParams();params.maxSeatCount = 10;params.seatMode = TUISeatMode.applyToTake;returnTUIVoiceRoomOverlay(roomId: roomId, behavior: RoomBehavior.prepareCreate, params: params);}));
说明:
TUIVoiceRoomOverlay 不支持作为子 Widget 嵌入到容器类 widget (例如:Container、Stack 等),只能作为独立页面跳转。因为内部使用了 Overlay,LiveKit 需要操控整个 Overlay 页面来切换浮窗模式。语聊场景不支持应用外浮窗模式。
TUIVoiceRoomOverlay 参数说明
参数名 | 类型 | 描述 | |
roomId | | String | 全局唯一的直播间 ID。 |
behavior | | RoomBehavior | 进房行为: autoCreate:自动创建直播间并进房。prepareCreate:先进入开播前预览页,用户点击开始直播后创建直播间并进房。join:观众进房。 |
params | | RoomParams | 主播开播参数,详见下一节。 |
RoomParams 参数说明:
参数名 | 类型 | 描述 |
maxSeatCount | int | 直播间最大麦位数。 |
seatMode | TUISeatMode | 观众的上麦模式: applyToTake:观众需要申请,主播同意后上麦。freeToTake: 观众自由上麦,无需主播同意。 |
浮窗模式效果
点击主播页面右上角的浮窗按钮,进入浮窗模式,效果如图所示:

自定义界面布局
TUILiveKit 支持灵活定制开播页与直播页的功能和样式,您可根据业务需求调整布局。
文案定制
TUILiveKit 使用 ARB 文件和 Flutter 标准国际化方案来管理 UI 文案显示。您可以直接编辑
livekit/lib/common/language/i10n/ 目录下的 ARB 文件来修改需要调整的文案:
livekit_en.arb:英文文案。livekit_zh.arb:简体中文文案。livekit_zh_Hant.arb:繁体中文文案。修改后通过命令行执行
flutter gen-l10n 重新生成本地化代码即可。生成成功后,livekit/lib/common/language/gen/ 目录里的代码文件将会刷新。图标定制
TUILiveKit UI 所需的图片资源在
livekit/assets/images/ 目录下管理,您可以直接替换该目录下的 PNG 图片文件来快速修改自定义界面所需的图标。
重新构建并运行应用,即可看到更新的图标。
下一步
恭喜您,现在您已经成功集成了主播开播 。接下来,您可以实现观众观看、直播列表和礼物系统等功能,可参考下表:



