OutgoingCallView

The OutgoingCallView lets you easily build UI when you’re calling or ringing other people in an app. It’s used to show more information about the participants you’re calling, as well as give you the option to cancel the call before anyone accepts.

Usage

In order to create the OutgoingCallView, you need to instantiate it with the outgoingCallMembers, callTopView and the callControls.

public var body: some View {
    OutgoingCallView(
        outgoingCallMembers: outgoingCallMembers,
        callTopView: callTopView,
        callControls: callControls
    )
}

The callTopView and callControls parameter is a SwiftUI view that is showing the actions you can do during a call.

If you are using our CallContainer to add calling support to your views, this view is automatically shown when the callingState in the CallViewModel is .outgoing.

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

public func makeOutgoingCallView(viewModel: CallViewModel) -> some View {
    CustomOutgoingCallView(viewModel: viewModel)
}

Sounds

By default, the outgoing call view plays ringing sound when the ringing is in progress. If you want to change the sounds, you should provide your own instance of the Sounds class in the Appearance object, while replacing the outgoingCallSound with your own sound file.

let sounds = Sounds()
sounds.outgoingCallSound = "your_sounds.m4a"
let appearance = Appearance(sounds: sounds)
streamVideoUI = StreamVideoUI(streamVideo: streamVideo, appearance: appearance)

Localization and icons

You can change the texts and the icons in the OutgoingCallView. For more details about changing the texts, please check the localization guide.

In order to change the icons, you need to create your own version of the Images class and change the icons you want to customize.

For example, if we want to change the hangup icon, we can do the following:

let images = Images()
images.hangup = Image("custom_hangup_icon")
let appearance = Appearance(images: images)
streamVideoUI = StreamVideoUI(streamVideo: streamVideo, appearance: appearance)