自定义菜单

更新时间: 2024/08/07 16:14:03

网易会议 NEMeetingKit 为您提供了一套会议中自定义菜单的接口,允许您对会议中的菜单进行更个性化的定制。

功能介绍

NEMeetingKit 支持底部 Toolbar 菜单与更多展开菜单两个区域的菜单定制,包括:

  • 支持设置菜单项图标。
  • 支持自定义 SDK 内置菜单与外部注入菜单的排序。
  • 支持设置菜单显示规则,包括:始终可见、仅普通参会者可见、仅主持人可见。
  • 支持无状态菜单项和有状态菜单项,且支持点击有状态的菜单项后触发状态迁移,并更新菜单的 UI 展示。
  • 支持显示或隐藏 SDK 的内置菜单。
  • 支持修改 SDK 内置菜单的 UI 展示。

注意事项

  • 自定义菜单时,您需要通过 options 参数进行配置,但此参数仅支持在入会前完成设置,在会议中设置不会生效。
  • 配置多状态菜单项时,您需要按照顺序填入需要配置的菜单项信息。
  • 您无法修改内置菜单项的默认方法,若您需要自定义方法,请使用自定义菜单项。
  • 若您需要配置菜单项图标,仅可使用 URL 网络资源进行配置。
  • 若您未成功修改菜单,不会影响原有的菜单项配置。

配置 Toolbar 菜单列表

在创建会议或加入会议时,设置 options 相关参数。

{
   "toolBarList":[
      {"id":0}, // 预置菜单项
      {"id":1},
      {"id":2},
      {
          "id":3, // 预置菜单项根据Id区分单状态与多状态
          "type":"multiple", // 多状态菜单项
          "btnConfig":[{ // 多状态菜单项配置-array
              "icon":"", // 图标 url地址
              "text":"", // 展示文案
          },{
              "icon":"",
              "text":"",
          }],
      },
      {
          "id":5
      },
      {
          "id":20, // 预置菜单项根据Id区分单状态与多状态
          "btnConfig":[{ // 多状态菜单项配置-array
              "icon":"", // 图标 url地址
              "text":"", // 展示文案
          },{
              "icon":"",
              "text":"",
          }],
      },
   ],
}

配置更多展开菜单列表

在创建会议或加入会议时,设置 options 相关参数。

{
   "moreBarList":[
      {
         "id":102,
         "type":"single", // 单状态菜单项
         "btnConfig":{ // 单状态菜单项配置-object
            "icon":"", // 图标 url地址
            "text":"我是展示文案" // 展示文案
         },
         "visibility":0, // 可见范围
         "injectItemClick": function(btnItem) {
             // TODO
         }
      },{
         "id":103,
         "type":"multiple", // 多状态菜单项
         "btnConfig":[{ // 多状态菜单项配置-array
            "icon":"", // 图标 url 地址
            "text":"我是false", // 展示文案
            "status":false // 菜单项状态
         },{
            "icon":"",
            "text":"我是true",
            "status":true
         }],
         "visibility":0, // 可见范围
         "btnStatus":false, // 默认菜单项状态
         "injectItemClick": function(btnItem) {
          // TODO
          // 通过调整形参的btnStatus去控制菜单项状态
          btnItem.btnStatus = true;
        }
      }
   ]
}

相关参考

参数说明

字段 类型 是否必选 说明

id

Number

必选

菜单项的唯一标识。

  • 若为内置菜单项,则 id 大于 100。
  • 若为非内置菜单项,则 id 小于等于 100。

type

String

可选(非内置菜单项必选)

菜单项类型。

  • single:单状态。
  • multiple:多状态。
btnConfig Object 或 Array 可选(非内置菜单项必选) 菜单项配置项。

btnConfig.object

Object

可选(非内置菜单项必选)

非内置菜单项配置项。参数包括:

  • icon:图标 URL。必选。
  • text:图标文案。必选。
  • status:图标状态。

visibility

number

可选

菜单项可见范围。

  • 0(默认):全局可见。
  • 1:仅主持人可见。
  • 2:非主持人可见。
btnStatus Number 或 Boolean 或 String 可选(非内置菜单项必选) 多状态菜单项展示状态配置字段。
injetItemClick function 必选 菜单项触发回调。

菜单图标规格说明

图标尺寸规格如下:

dpi 图标尺寸
mdpi 24px*24px
xhdpi 48px*48px

SDK 内置菜单项说明

NEMeeting SDK 目前内置了以下菜单项,您可根据需要调整内置菜单项的位置、标题、图标和可见性。

菜单项
菜单 ID
类型
是否允许在更多展开菜单中显示
默认状态顺序(数组第一位与第二位) 支持平台
音频 0 multiple 开启,关闭 Web,H5
视频 1 multiple 开启,关闭 Web,H5
屏幕共享 2 multiple 结束共享,开启共享 Web
参会者列表 3 single - Web,H5
邀请 20 single - Web
聊天 21 single - Web,H5
白板 22 multiple - Web
安全 26 single - Web
录制 27 single - Web
设置 28 single - Web
通知 29 single - Web
批注 30 single - Web
同声传译 31 single - Web
此文档是否对你有帮助?
有帮助
去反馈
  • 功能介绍
  • 注意事项
  • 配置 Toolbar 菜单列表
  • 配置更多展开菜单列表
  • 相关参考
  • 参数说明
  • 菜单图标规格说明
  • SDK 内置菜单项说明