Update Chat UI

Sendbird Chat UIKit iOS
1

Basically we are using the SDK through cocoapod and installed below libraries:
pod ‘SendBirdSDK’, ‘3.0.224’
pod ‘SendBirdUIKit’, ‘2.1.7’

As you mentioned, previously I got the attached PDF file from the “Sendbird Support” to customize the theme, color, etc.
We are directly using the SDK class “SBUChannelViewController” controller and adding it as a child controller to display the Chat as below:

let channelVC = SBUChannelViewController(
channelUrl: channelUrl,
messageListParams: messageListParams
)

self.addChild(channelVC)

In that, I updated the chat color, “+” icon (to send the file) color, etc. But in this default controller, I need to hide the other user’s profile picture which is showing on the left side. Also, I need to change the image of the “+” icon.

2

Hello @Ibrahim_Malada,

The “+” icon can be customized to change the SBUIconSet.iconAdd to the desired icon.

SBUIconSet.iconAdd = UIImage(~~)

and, To hide the Cover image, you must customize the message cells of the SBUChannelViewController.
Please refer to the document below.

3

Hello @Tez

Thanks for sharing your feedback. From your answer, I am able to change the “+” icon. So thanks for it.

But can you please more elaborate or share some code snippet to customize the cell? Because I am adding the “SBUChannelViewController” as child controller. So, I cannot do something like below:

class SBParentChatVC: SBUChannelViewController {

let channelVC = SBUChannelViewController(
            channelUrl: channelUrl,
            messageListParams: messageListParams
            
        )
        channelVC.navigationController?.isToolbarHidden = true
        channelVC.navigationController?.isNavigationBarHidden = true
        
        self.addChild(channelVC)

One more thing, how I can know about display message controls, user pictures, tick-mark, etc. controls? Reason is that, in “cellForRowAt” method, I also need to replace some text message with others.

So, code snippet to customize the cell and display will be helpful.

Thank you.

4

Hello @Tez

Did you get a chance to review my comment? Your details related to code snippet to customize the cell will be helpful.

Thank you

5

Hi @Ibrahim_Malada

Have you checked the uikit sample project?
Sample project has samples customizing cells.

Please refer to below for the code customizing the message cell.
ChannelCustomManager.swift

And, please refer to the entire sample project as well.
uikit-sample

6

Hello @Tez

For your reference, I have added classes from the uikit sample and did some customization directly to class.

Thank you

1 Like