Hi i am planning to implement Custom UI for ios using Swift. Is there any documentation available or any sample project available to do so

Description
How to implement Custom UI using Swift.

Hey @dayal,

Thanks for using the dev forum!

  1. Before joining a meeting assign a MobileRTCCustomizedUIMeetingDelegate. This delegate will listen to updates about when to sure your custom meeting UI:
    static func enableCustomMeetingUI(_ shouldUseCustomMeetingUI: Bool, customMeetingUIDelegate: MobileRTCCustomizedUIMeetingDelegate) {
        guard let meetingSettings = MobileRTC.shared().getMeetingSettings(),
              let meetingService = MobileRTC.shared().getMeetingService() else { return }

        meetingSettings.enableCustomMeeting = shouldUseCustomMeetingUI
        meetingService.customizedUImeetingDelegate = customMeetingUIDelegate
    }

extension ViewController: MobileRTCCustomizedUIMeetingDelegate {
    // Called when local user joins a meeting, and when the local user has been admitted to meeting from waiting room.
    func onInitMeetingView() {
        guard let customMeetingUIVC = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "CustomMeetingUIViewController") as? CustomMeetingUIViewController,
              let meetingService = MobileRTC.shared().getMeetingService() else { return }
        meetingService.delegate = customMeetingUIVC

        self.present(customMeetingUIVC, animated: false, completion: nil)
        self.customMeetingUIViewController = customMeetingUIVC
        self.hasPresentedCustomMeetingUI = true
        updateViews()
    }

    func onDestroyMeetingView() {
        MobileRTC.shared().getMeetingService()?.delegate = self
        updateViews()
        return
    }
}
  1. Join/start a meeting and present your UI using the callbacks above.
  2. Implement the MobileRTCMeetingServiceDelegate in your custom meeting UI so that you can listen and react to meeting events:
extension CustomMeetingUIViewController: MobileRTCMeetingServiceDelegate {
  1. Add MobileRTCVideoViews to your UI to render user’s video streams:
    static func localUserVideoView(_ videoAspect: MobileRTCVideoAspect, frame: CGRect) -> MobileRTCVideoView? {
        guard let meetingService = MobileRTC.shared().getMeetingService() else { return nil }

        let localUserID = meetingService.activeUserID()
        let localUserVideoView = MobileRTCVideoView(frame: frame)
        localUserVideoView.setVideoAspect(videoAspect)
        let showAttendeeVideoSuccessful = localUserVideoView.showAttendeeVideo(withUserID: localUserID)

        if showAttendeeVideoSuccessful {
            print("Started showing local user video.")
        } else {
            print("Failed to show local user video.")
        }

        return localUserVideoView
    }
    static func remoteUserVideoView(userID: UInt, videoAspect: MobileRTCVideoAspect, frame: CGRect) -> MobileRTCVideoView? {
        let remoteUserVideoView = MobileRTCVideoView(frame: frame)
        remoteUserVideoView.setVideoAspect(videoAspect)
        let showAttendeeVideoSuccessful = remoteUserVideoView.showAttendeeVideo(withUserID: userID)

        if showAttendeeVideoSuccessful {
            print("Started showing remote user video.")
        } else {
            print("Failed to show remote user video.")
        }

        return remoteUserVideoView
    }

Thanks!
Michael

1 Like

Thank Michael. Hope this will help me.

Hey @dayal,

You are welcome :slight_smile:
Please let me know if you have any other questions.

Thanks!
Michael