Basics of ViewController

This page explains the basic concepts and common classes that apply to all key functions and their view controllers in UIKit for iOS.

In Sendbird UIKit, there is a SBUViewControllerSet global class that manages the different types of view controllers used in each respective key function.

To view the image in full screen, click on the

Each key function has a view controller and the view controller type refers to a customizable value of the SBUViewControllerSet property. The different class types of all the view controllers in UIKit are listed as follows:

If you don't want to use the default view controller provided by the UIKit, you can set a custom view controller in SBUViewControllerSet. By implementing a view controller that's been customized in the global class, you can use it across the entire client app without having to change it each time. Refer to the code below to see how to customize SBUGroupChannelListViewController as an example.

Note: You can customize other view controllers using the same code.

class CustomViewController: SBUGroupChannelListViewController {
    // Customize your view controller.
}

// Set your custom view controller in `SBUViewControllerSet` before using `GroupChannelListViewController`.
SBUViewControllerSet.GroupChannelListViewController = CustomViewController.self

When creating a custom view controller instance, Sendbird UIKit follows the order below:

1. A view controller that's been customized upon initial settings.
2. A view controller that's been customized in SBUViewControllerSet.
3. A non-customized, default view controller provided by Sendbird UIKit.

If you didn't set your own custom view controller while initializing, then a view controller that's been customized in SBUViewControllerSet is used across the UIKit. If there are no custom view controllers, then the default view controller provided by Sendbird UIKit in SBUViewControllerSet is used.

Sendbird UIKit's life cycle provides various interfaces that are applied to all view controllers and views in key functions. You can set up views and layouts and decide on theme-related components such as font and color. These interfaces are customizable as you can override the value of properties and methods in the view to fit the style of your app. Sendbird UIKit's life cycle works in accordance with Apple's UIKit life cycle using methods that apply to the whole UIKit.

To view the image in full screen, click on the

Sendbird UIKit's ViewController life cycle works in accordance with Apple's UIKit life cycle, meaning the methods are called at a set timing as shown in the image below.

To view the image in full screen, click on the

All view controllers in Sendbird UIKit provide the following interfaces.

Sendbird UIKit's view life cycle works in accordance with Apple's UIKit life cycle, meaning the methods are called at a set timing as shown in the image below.

To view the image in full screen, click on the

All views in Sendbird UIKit provide the following interfaces.

Every view controller has a corresponding module, which is composed of multiple components, also referred to as module components. The module provides these components to the view controller to compose the UI. Each view controller is set through the setupView() method of the module component. To create a view, the configure method of the module component in the setupViews() method is called. The setupViews() method of the Sendbird View life cycle is called when the loadView() method of Apple's UIKit life cycle is initiated.

If you wish to use a custom view controller, you must override the setupViews() method and call super.setupViews() instead before calling the configure method of the module component.

Every module component has properties that use a delegate and a data source to exchange view-related events and data with the view controller. To learn more about the data flow and customization of modules, go to the Modules page.

To view the image in full screen, click on the

A view model directly communicates with Sendbird Chat SDK to exchange and request data. Without needing to call the Chat SDK interface, the view controller can simply use the view model to manage and process chat-related data in UIKit.

To view the image in full screen, click on the

Every view model has a delegate that is used to send data updates in the form of events to the view controller. The view model also uses a data source to gather necessary data from the view controller.

To view the image in full screen, click on the

All view controllers provided by Sendbird UIKit have a corresponding view model. For example, the SBUGroupChannelListViewController class that displays the channel list view owns SBUGroupChannelListViewModel.

Refer to the table below to see the corresponding view controller and view model for each key function.

To use a customized view model or to customize an existing event of a view model, you must override the view controller.

1. To apply the custom view model in the view controller, you need to override the createViewModel method. Refer to the following code:

class CustomViewModel: SBUGroupChannelListViewModel { 
    // Implement custom code here.
}

class CustomViewController: SBUGroupChannelListViewController {
    override func createViewModel(channelListQuery: GroupChannelListQuery?) {
        self.viewModel = CustomViewModel(delegate: nil, channelListQuery: nil)
    }
}

2. To customize a single event of a view model, you have to re-implement the delegate methods of the view model. Refer to the following code:

extension CustomChannelListViewController: SBUGroupChannelListViewModelDelegate {
    override func groupChannelListViewModel(
        _ viewModel: SBUGroupChannelListViewModel,
        didChangeChanneList channels: [GroupChannel]?,
        needsToReload: Bool
    ) {
        // Implement the delegate methods here.
    }
}

You can see how to customize the view model in each key function under the corresponding key function pages.

Every view controller in a key function has its own theme. When the configure method of each module component is called, the same theme object of the view controller is used. Hence, by changing the theme in the view controller, you can also customize the theme used in the module component.

There are three ways to customize the theme. Sendbird UIKit follows the listed order below in implementing the customization.

1. Customize the theme in the module component. Go to Customization under Modules to see how.

2. Customize the theme in the view controller. See the code below.

let channelListVC = SBUViewControllerSet.GroupChannelListViewController()
channelListVC.theme = CustomTheme()
let navigationController = UINavigationController(rootViewController: channelSettingsVC)
present(navigationController, animated: true)
// Update the module and component of the newly customized view controller.

Note: You can apply the code above to all view controllers.

3. Customize the Global theme class. Go to Customize global theme under Theme resources to see how.