logo
On this page

Customize the menu bar


Customize the menu bar button list

The Video Conference Kit (ZegoUIKitPrebuiltVideoConference) allows you to configure the buttons of the top/bottom menu bar. To remove the default buttons or add custom ones to the bottom menu bar, you can configure the bottomMenuBarConfig:

(Similarly, to configure top menu bar buttons or add custom buttons to the top menu bar, use the topMenuBarConfig and addButtonToTopMenuBar.)

  • buttons: Built-in buttons placed in the menu bar. By default, all buttons are displayed. If you need to hide some buttons, use this to configure them. For details, see Implement an audio-only conference.
  • maxCount: Maximum number of buttons that can be displayed by the menu bar. Value range [1 - 5], the default value is 5.

Moreover, you can also use the addButtonToBottomMenuBar method to add your customized buttons to the menu bar.

If the total number of built-in buttons and custom buttons does not exceed 5, all buttons will be displayed. Otherwise, other buttons that cannot be displayed will be hidden in the three dots (⋮) button. Clicking this button will pop up the bottom sheet to display the remaining buttons.

The effect will be like this:

Customize the hidden behavior of the menu bar

Video Conference Kit (ZegoUIKitPrebuiltVideoConference) supports automatic or manual hiding of the menu bar. You can control this by using the following two configurations in the bottomMenuBarConfig and topMenuBarConfig:

  • hideByClick: Whether the menu bar can be hidden by clicking on the unresponsive area, enabled by default.
  • hideAutomatically: Whether the menu bar is automatically hidden after 5 seconds of user inactivity, enabled by default.

Previous

Hide components

Next

Set a leave confirmation dialog