/ UIKit / Android
UIKit
Chat UIKit Android v3
Chat UIKit Android
Chat UIKit
Android
Version 3

Screens

Copy link

UIKit v3 for Android allows you to create customizable views and execute essential chat functions such as list channels, create channels, and chat in channels. Key functions are carried out on a screen basis, meaning each function corresponds to a single screen. A key function is composed of three main components: Fragment, Module, and ViewModel. Each fragment has a corresponding module that creates the view, and each module is made up of customizable UI components. A fragment also has a corresponding ViewModel that provides the necessary data from Sendbird Chat SDK. Refer to the table below to see which key functions we provide and the components that make up each key function.

List of screens

Copy link
Key functionFragmentModuleComponentViewModel

List channels

ChannelListFragment

ChannelListModule

HeaderComponent

ChannelListComponent

StatusComponent

ChannelListViewModel

Chat in a group channel

ChannelFragment

ChannelModule

ChannelHeaderComponent

MessageListComponent

MessageInputComponent

StatusComponent

ChannelViewModel

Chat in an open channel

OpenChannelFragment

OpenChannelModule

OpenChannelHeaderComponent

OpenChannelMessageListComponent

OpenChannelMessageInputComponent

StatusComponent

OpenChannelViewModel

Create a group channel

CreateChannelFragment

CreateChannelModule

SelectUserHeaderComponent

CreateChannelUserListComponent

StatusComponent

CreateChannelViewModel

Configure group channel settings

ChannelSettingsFragment

ChannelSettingsModule

ChannelSettingsHeaderComponent

ChannelSettingsInfoComponent

ChannelSettingsMenuComponent

ChannelSettingsViewModel

Configure open channel settings

OpenChannelSettingsFragment

OpenChannelSettingsModule

OpenChannelSettingsHeaderComponent

OpenChannelSettingsInfoComponent

OpenChannelSettingsMenuComponent

OpenChannelSettingsViewModel

Invite users

InviteUserFragment

InviteUserModule

SelectUserHeaderComponent

InviteUserListComponent

StatusComponent

InviteUserViewModel

Register members as operators

RegisterOperatorFragment

RegisterOperatorModule

SelectUserHeaderComponent

RegisterOperatorListComponent

StatusComponent

RegisterOperatorViewModel

Register participants as operators

OpenChannelRegisterOperatorFragment

OpenChannelRegisterOperatorModule

SelectUserHeaderComponent

OpenChannelRegisterOperatorListComponent

StatusComponent

OpenChannelRegisterOperatorViewModel

List channel members

MemberListFragment

MemberListModule

HeaderComponent

MemberListComponent

StatusComponent

MemberListViewModel

List channel participants

ParticipantsListFragment

ParticipantListModule

HeaderComponent

ParticipantListComponent

StatusComponent

ParticipantListViewModel

List banned users in group channel

BannedUserListFragment

BannedUserListModule

HeaderComponent

BannedUserListComponent

StatusComponent

BannedUserListViewModel

List banned users in open channel

OpenChannelBannedUserListFragment

OpenChannelBannedUserListModule

HeaderComponent

OpenChannelBannedUserListComponent

StatusComponent

OpenChannelBannedUserListViewModel

List muted members

MutedMemberListFragment

MutedMemberListModule

HeaderComponent

MutedMemberListComponent

StatusComponent

MutedMemberListViewModel

List muted participants

OpenChannelMutedParticipantListFragment

OpenChannelMutedParticipantListModule

HeaderComponent

OpenChannelMutedParticipantListComponent

StatusComponent

OpenChannelMutedParticipantListViewModel

List operators in group channel

OperatorListFragment

OperatorListModule

HeaderComponent

OpenChannelOperatorListComponent

StatusComponent

OperatorListViewModel

List operators in open channel

OpenChannelOperatorListFragment

OpenChannelOperatorListModule

HeaderComponent

OperatorListComponent

StatusComponent

OpenChannelOperatorListViewModel

Moderate group channels and members

ModerationFragment

ModerationModule

HeaderComponent

ModerationListComponent

ModerationViewModel

Moderate open channels and participants

OpenChannelModerationFragment

OpenChannelModerationModule

HeaderComponent

OpenChannelModerationListComponent

OpenChannelModerationViewModel

Search messages

MessageSearchFragment

MessageSearchModule

MessageSearchHeaderComponent

MessageSearchListComponent

StatusComponent

MessageSearchViewModel

Reply to messages

MessageThreadFragment

MessageThreadModule

MessageThreadHeaderComponent

ThreadListComponent

MessageThreadInputComponent

StatusComponent

MessageThreadViewModel


Architecture

Copy link

In a key function, fragment plays the most important role because it needs to create a module and ViewModel in order to build the whole screen and gather data from the Chat SDK. The following diagram explains the basic architecture of UIKit for Android.

UIKit for Android provides both activity and fragment for each key function. An activity allows you to build a single screen and it contains multiple fragments that enable you to divide the UI for more discrete customization. But in UIKit for Android, there is one fragment for every activity, which means the fragment takes up the whole screen. We offer both activity and fragment so you can choose which one to build your app with. You may solely use activity instead of fragment if you wish to.

As shown in the diagram above, each fragment generates a module to build a view. A module is composed of several components, which combined together, make up a single screen. You can customize the view on a component-level, allowing you to easily make small style changes.

Fragments also need to create and use ViewModel to communicate with the Chat SDK. The ViewModel manages data received from the SDK, which are necessary to perform key functions in the screen. You can customize the ViewModel to change how you wish to receive and process data. The fragment plays a binding role between data provided by the ViewModel and view created by the module.

BaseModuleFragment lifecycle

Copy link

All fragments in the UIKit inherit a BaseModuleFragment class, which creates the modules, UI components, and ViewModel in a set process as shown in the flow diagram below. BaseModuleFragment manages and controls the lifecycle of all fragments in the UIKit.

Note: The result of whether the ViewModel has been authenticated or not is always called after a view has been built using the onCreateView method.

When the onCreate method of a fragment is called, the onCreateModule, onConfigureParams, and onCreateViewModel methods of BaseModuleFragment are also called. The onCreateModule method creates a module for the fragment to build a view, while the onCreateViewModel method creates a ViewModel that communicates with the Chat SDK. By calling onConfigureParams, you can configure parameters in the setter methods of each module or component. It is strongly recommended that the parameters in the setter methods are set before creating a view.

Once the module and its UI components have been created, the fragment calls the onCreateView method that exists in the module and the UI components to build a view. The returned view of the module is then used by the fragment.

After a ViewModel has been created, the fragment's onCreate method requires the ViewModel to be authenticated. To authenticate, the connect() method of Chat SDK is called and requests connection to Sendbird server. Depending on whether the corresponding key function requires any channel information, the server can retrieve such channel data during the authentication process.

Once the ViewModel is authenticated, the onBeforeReady method is called right before the onReady method. Using onBeforeReady, you can change the setter methods of each component in a module.

Lastly, the onReady method is called when the initialization process of the module and its components are finished and the authentication process of the ViewModel is done. You can find out whether everything has been properly initialized and authenticated through the ReadyStatus property sent to the onReady method.

Once the entire process is finished, the fragment's lifecycle will initialize. The following table shows all methods of the BaseModuleFragment lifecycle.

List of methods of BaseModuleFragment

Copy link
MethodsDescription

onCreateViewModel

Creates a ViewModel that receives and manages data from the Chat SDK. This method is called when the onCreate method of the fragment is called.

onCreateModule

Creates a module that builds the view used in a fragment. This method is called when the onCreate method of the fragment is called. There is a set module for each view but the module can be used in other views if needed.

onConfigureParams

Specifies a set of parameters to change in the module. This method is called when the onCreate method of the fragment is called. These parameters contain a bundle that the activity uses to exchange data between different screens. The bundle holds important data about users and channels as key-values items.

onBeforeReady

Changes the setter methods related to ViewModel events of each component in the module. This method is called after a view is built using the onCreateView method and right before the onReady method is called.

onReady

Indicates that the initialization process of the module and its components are finished and the authentication process of the ViewModel is done. This method is called right after authentication is complete and if the result is successful, all modules, UI components, and ViewModel in the fragment are ready to be used.