拉流以及布局

功能说明

通过参会者事件回调开发者可获取当前会议中的人数，根据人数可通过调用changeLayout实现按需请流。

实现方法

1. 初始化拉流配置

在拉流之前，需要使用setUnityLayoutConfig初始化拉流配置。

/**
 * 获取SDK统一布局配置
 * @param width 宽度
 * @param height 高度
 */
static getSDKUnityLayoutLayoutConfigInstall(width: number, height: number): XYSDKUnityLayoutLayoutConfig {
  let config: XYSDKUnityLayoutLayoutConfig = {
    maxRecvNum: 0,
    updateSize: false,
    screenInfos: [{
      screenId: "main",
      screenWidth: width,
      screenHeigh: height,
      maxDecoderNum: 0,
      maxViewCountPerPage: 0,
      layout: {
        windowId: "main",
        layoutMode: XYSDKUnityLayoutMode.Speaker,
        pageIndex: 0,
        maxViewCountPerPage: 6,
        viewId: -1,
        localContent: false,
        onlyContent: false,
        multipleSharedCount: 0,
        forceUid: "",
        templateId: "",
        viewData: []
      }
    }],
    pad: false,
    initLayoutModes: [
      XYSDKUnityLayoutMode.Speaker,    // 非对称布局Speaker模式
      XYSDKUnityLayoutMode.Gallery,    // 对称布局gallery模式
      XYSDKUnityLayoutMode.Chairman,   // 主会场模式
      XYSDKUnityLayoutMode.ContentOnly,// 仅共享屏幕模式
      XYSDKUnityLayoutMode.Page,       // 翻页模式
      XYSDKUnityLayoutMode.UiTemplate, // 自定义模式
      XYSDKUnityLayoutMode.Avc,        // avc多画面
      XYSDKUnityLayoutMode.Locked,     // force
      XYSDKUnityLayoutMode.SuperChairman, // 超级主会场
      XYSDKUnityLayoutMode.SoftEmpty,  // 空请流驾驶模式
      XYSDKUnityLayoutMode.SoftWhitboard, // 移动端白板模式
      XYSDKUnityLayoutMode.None        // 清除所有模式
    ],
    // 音频画廊配置
    audioGalleryConfig: {
      viewW: 108,
      viewH: 108,
      lineSpace: 30,
      columnSpace: 0,
      landscapeLineSpace: 8,
      landscapeColumnSpace: 60
    },
    // 音频演讲者配置
    audioSpeakerConfig: {
      asViewW: 236,
      asViewH: 184,
      viewW: 108,
      viewH: 108,
      viewColumnSpace_twoItem: 30,
      viewLineSpace: 30,
      viewColumnSpace: 0,
      landscapeViewLineSpace: 30,
      landscapeViewColumnSpace: 0,
      viewOppositeASOffset: 110,
      landscapeViewOppositeASOffset: 50
    },
    // 音频小窗口配置
    audioSmallConfig: {
      viewW: 100,
      viewH: 100,
      rightMargin: 10,
      topMargin: 0,
      landscapeLeftMargin: 10,
      landscapeBottomMargin: 10
    },
    // 视频配置
    videoConfig: {
      density: 1,
      viewLineSpace: 2,
      viewColumnSpace: 2,
      landscapeSymmetryViewLeftMargin: 0,
      landscapeSymmetryViewRightMargin: 0,
      smallViewBottomMargin: 5,
      smallViewLeftMargin: 5,
      smallViewRightMargin: 5,
      smallViewColumnSpace: 5
    }
  };
  return config;
}

2. 布局模式

SDK提供了以下布局模式：

演讲者模式 (1大N小)
画廊模式
主会场模式
自定义请流
等其他模式

布局最佳体验示例：

3. 布局请求参数

XYSDKUnityLayoutRequest常用字段说明：

字段	类型	说明
windowId	string	窗口ID，请传"main"
layoutMode	XYSDKUnityLayoutMode	布局模式
pageIndex	number	0表示非对称布局，1表示对称第一屏，默认-1
maxViewCountPerPage	number	每一屏最大请流数量
viewId	number	移动端为0
localContent	boolean	本地共享独立回显
onlyContent	boolean	仅共享屏幕入会
forceUid	string	force layout uid
multipleSharedCount	number	多路content支持数量，最大4
templateId	string	自定义请流模版id
viewData	XYSDKUnityLayoutView[]	自定义请流数据

示例代码

监听会议变化

onConfInfoChanged(info: XYSDKConfInfo) {
  this.confInfo = info;
  this.hasContent = info.contentTotalNum > 0;
  this.handelChairManUrlUpdate(info.chairManUrl);
  this.showPeopleCount = info.displayableEpCount;
  this.updateMultiContentStatus();
  this.calculateVideoPageLength();
  this.calculateAudioPageLength();
  this.updatePipEnableStatus(!this.isRequestedLayout);
  
  if (!this.isRequestedLayout) {
    this.requestLayout(this.index)
    this.isRequestedLayout = true;
  } else if (this.index >= this.totalCount()) {
    this.index = this.totalCount() - 1;
    this.requestLayout(this.index);
  }
}

计算请流

private requestLayout(index: number) {
  let pageModel = this.getLayoutPageModel(this.index);
  let info: XYSDKUnityLayoutRequest = XYSDKInterFaceInstall.getSDKUnityLayoutRequestInstall();
  info.pageIndex = index;
  info.maxViewCountPerPage = this.getLayoutMaxPerPage(index);
  
  if (pageModel.forceUniqueId.length > 0) {
    info.layoutMode = XYSDKUnityLayoutMode.Locked;
    info.forceUid = pageModel.forceUniqueId;
  } else {
    info.layoutMode = index < 1 ? XYSDKUnityLayoutMode.Speaker : XYSDKUnityLayoutMode.Page;
  }
  
  let clientConfig = XYRTCEngine.getInstance().clientConfig;
  if (clientConfig) {
    info.multipleSharedCount = clientConfig.enterpriseConfig.enableMultipleShared ? 
      clientConfig.enterpriseConfig.multipleSharedCount : 0;
  }
  
  XYRTCEngine.getInstance().changeLayout([info]);
}

接收视频流

onVideoStreamChanged(streamArray: XYSDKVideoStreamInfo[]) {
  let layoutMode: XYLayoutPageModel = this.getLayoutPageModel(this.index);
  this.updateLayoutVideoModel(layoutMode, streamArray);
  this.layoutPageSet.set(this.index, layoutMode);
}

视频流渲染

XYVideoRender({
  videoInfo: this.videoModel.streamInfo, // 接收到的视频流信息
  renderColor: ...
})

本地视频画面处理

在onVideoStreamChanged中返回的local只是占位，需要自己匹配callUri，并且非content，更新videoSourceId、videoState等信息。音视频状态需要自行维护更新。

获取videoSourceId的API：

XYRTCEngine.getInstance().getLocalSourceID();

流程图

API参考

changeLayout - 改变布局
setUnityLayoutConfig - 设置统一布局配置
onVideoStreamChanged - 视频流变更回调
getLocalSourceID - 获取本地视频源ID

2025-05-27 19:48:52

导出PDF文档