Flutter

最近更新时间:2024-08-30 15:04:42

我的收藏

功能介绍

观众连麦功能‌是一种实时互动交流方式,通过观众连麦功能,主播可以与多达9个观众进行实时互动,无论是解答问题、分享经验还是进行娱乐互动,都能极大地提升观众的参与感满意度。这种直接的互动和交流为商业化运营提供了更加便捷和高效的渠道,同时也为观众提供了更加个性化和定制化的购物体验。观众连麦功能适用于多个场景,包括电商直播、娱乐直播、在线教学等。
单人连麦
多人连麦







使用说明

观众发起连麦申请

点击连麦请求按钮
选择连麦方式
发送连麦请求,等待主播同意
主播同意后,连麦成功













主播处理观众连麦请求

收到观众的连麦请求
点击连麦用户,打开连麦面板
点击同意后,连麦成功










功能定制

自定义主播端连麦管理面板视图

如您需要自定义主播端连麦管理面板视图 ,请参考以下路径更改:
// 文件位置:Flutter/lib/widget/live_room/anchor/live_streaming/link/

link // 主播连麦相关视图目录
├── anchor_link_mic_manage_panel_widget.dart // 连麦管理面板:可接受观众连麦、拒绝观众连麦、挂断连麦
└── apply_link_mic_float_widget.dart // 有观众申请连麦时,悬浮在顶层的提示连麦的视图

自定义观众端连麦申请面板视图

如您需要自定义观众端申请连麦面板视图 ,请参考以下路径更改:
// 文件位置:Flutter/lib/widget/live_room/audience/component/live_streaming/link/

link // 观众连麦相关的视图目录
├── select_link_mic_type_panel_widget.dart // 观众连麦弹出的选择语音连麦还是视频连麦的视图
└── video_link_settings_panel_widget.dart // 视频连麦时相关参数设置面板视图

关键代码

观众连麦

TUILiveKit 观众连麦功能 主要是通过 LiveService 实现,在 LiveService 中,您可通过 createEngine() 获取到 TUIRoomEngine 对象,进而调用连麦相关 API 函数,实现观众连麦功能。以观众 B 申请和主播 A 连麦为例,具体交互时序可参考下图:




观众发送连麦请求

Dart
// 文件位置:Flutter/lib/service/impl/room_engine_service.dart

@override
TUIRequest takeSeat(int seatIndex, int timeout, TUIRequestCallback? requestCallback) {
return roomEngine.takeSeat(seatIndex, timeout, requestCallback);
}

主播端收到连麦请求

Dart
// 文件位置:Flutter/lib/manager/observer/live_observer.dart

super.onRequestReceived = (request) {
LiveKitLogger.info("$tag onRequestReceived:[request:$request");
liveController.seatController.onRequestReceived(request);
};

观众取消连麦请求

Dart
// 文件位置:Flutter/lib/service/impl/room_engine_service.dart

mTUIRoomEngine.cancelRequest(requestId, new TUIRoomDefine.ActionCallback() { @Override public void onSuccess() {} @Override public void onError(TUICommonDefine.Error error, String message) {} });

主播端收到取消连麦请求

Dart
// 文件位置:Flutter/lib/manager/observer/live_observer.dart

super.onRequestCancelled = (requestId, userId) {
LiveKitLogger.info("$tag onRequestCancelled:[requestId:$requestId,userId:$userId");
liveController.seatController.onRequestCancelled(requestId, userId);
};

主播处理连麦请求。

Dart
// 文件位置:Flutter/lib/service/impl/room_engine_service.dart

mTUIRoomEngine.responseRemoteRequest(requestId, true, new TUIRoomDefine.ActionCallback() { @Override public void onSuccess() {} @Override public void onError(TUICommonDefine.Error error, String message) {} });

观众连麦成功后,主播挂断观众的连麦

Dart
// 文件位置:Flutter/lib/service/impl/room_engine_service.dart

mLiveService.kickUserOffSeatByAdmin(0, userId, new TUIRoomDefine.ActionCallback() { @Override public void onSuccess() {} @Override public void onError(TUICommonDefine.Error error, String message) {} });

观众连麦成功后,观众结束连麦

Dart
// 文件位置:Flutter/lib/service/impl/room_engine_service.dart

mLiveService.leaveSeat(new TUIRoomDefine.ActionCallback() { @Override public void onSuccess() {} @Override public void onError(TUICommonDefine.Error error, String message) {} });