Skip to main content


The CallTopView represents the component displayed at the top of the CallView. By default, it contains a button to minimize the call (on the leading side), a layout menu (for changing different call participant layouts) and a button that can show the call participants list (on the trailing side).

Let's see how to use the component.


To instantiate the CallTopView, you just need to provide the CallViewModel:

var body: some View {
CallTopView(viewModel: viewModel)

If you want to customize (or completely replace) the CallTopView, you should use the ViewFactory method makeCallTopView:

public func makeCallTopView(viewModel: CallViewModel) -> some View {
CustomCallTopView(viewModel: viewModel)

Changing layouts

The default CallTopView contains a layout menu selection view, which can change the participantsLayout in the CallViewModel. The participantsLayout is an enum, with the following cases:

  • grid - the participants are shown in a grid
  • spotlight - one participants is shown in a spotlight, while the others are in a horizontal list below
  • fullScreen - only one participant is shown

Did you find this page helpful?