UI Customization

Customize Conversation UI components in your iOS app

The SpotImCustomUIDelegate allows you to customize UI components, such as the login prompt, Conversation footer, and navigation title.

20882088

SpotImCustomUIDelegate Reference

Component

CustomizableView

1

Login prompt

loginPrompt(textView: UITextView)

2

Say control in the Pre-Conversation ViewController

(This is not shown in the images above.)

sayControlInPreConversation(labelContainer: BaseView, label: BaseLabel)

3

Say control in the Conversation

sayControlInMainConversation(labelContainer: BaseView, label: BaseLabel)

4

Community question

communityQuestion(textView: UITextView)

5

Conversation footer

conversationFooter(view: UIView)

6

Navigation title

navigationItemTitle(label: UILabel)

NOTE: set SpotIm.enableCustomNavigationItemTitle = true

7

Community guidelines

communityGuidelines(textView: UITextView)

8

Create Comment action button

commentCreationActionButton(button: BaseButton)

9

Read-only label

readOnlyLabel(label: UILabel)

10

Empty state read-only label

emptyStateReadOnlyLabel(label: UILabel)



Customize UI components

Use the following steps to customize UI components:

  1. Implement the SpotImCustomUIDelegate protocol.
extension ArticleViewController: SpotImCustomUIDelegate {
  func customizeView(view: CustomizableView, isDarkMode: Bool, postId: String) {
      switch view {
      case .loginPrompt(let textView):
          // set your own customization
          break
      // set more customizations to another CustomizableView
      default:
          break
      }
  }
}

  1. In SpotIm.createSpotImFlowCoordinator, set the SpotImCustomUIDelegate to the coordinator.
SpotIm.createSpotImFlowCoordinator(loginDelegate: self) { result in
  switch result {
  case .success(let coordinator):
      self.spotIMCoordinator = coordinator
      coordinator.setCustomUIDelegate(delegate: self) // set the delegate
  }
}


Did this page help you?