Custom UI

SpotImCustomUIDelegate

The SDK supports to customize the following UI components via SpotImCustomUIDelegate:

Component

CustomizableView

Notes

1

Login prompt

loginPrompt(textView: UITextView)

2

Say control in pre-conversation

sayControlInPreConversation(labelContainer: BaseView, label: BaseLabel)

3

Say control in conversation

sayControlInMainConversation(labelContainer: BaseView, label: BaseLabel)

4

Community question

communityQuestion(textView: UITextView)

5

Conversation footer

conversationFooter(view: UIView)

6

Navigation title

navigationItemTitle(textView: UITextView)

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)

In order to add your own customization for SpotIm UI elements, you have to implement the SpotImCustomUIDelegate protocol as follows:

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 other CustomizableView
      default:
          break
      }
  }
}

In SpotIm.createSpotImFlowCoordinator, set your SpotImCustomUIDelegate to the coordinator as follows:

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

Other customization

You can customize the text for sorting options

// Method signature
setCustomSortByOptionText(option: SpotImSortByOption, text: String)

// SpotImSortByOption enum
enum SpotImSortByOption {
    case best
    case newest
    case oldest
}

// Example
SpotIm.setCustomSortByOptionText(option: .best, text: "CustomTitle")

Did this page help you?