Customization

Theme Customization

In this section we have explained about the configuration options present in the SDK to modify color, font etc.

You can override any of the properties from the default configuration. Doing it in your AppDelegate is preferred.

Conversation Screen Background Color

Background color of the Conversation screen

Kommunicate.defaultConfiguration.backgroundColor = UIColor.white

Received Message Background Color

The background color of the received message bubble.

KMMessageStyle.receivedBubble.color = UIColor.lightGray

Sent Message Background Color

The background color of the sent message bubble.

KMMessageStyle.sentBubble.color = UIColor.lightGray

Text view style

Change the placeholder style

KMChatBarConfiguration.TextView.placeholder = KMStyle(font: .font(.normal(size: 16)), text: .red)

Change the text style

KMChatBarConfiguration.TextView.text = KMStyle(font: .font(.normal(size: 18)), text: .red)

Message Text Font and Color

Use this for changing message text font and color in the Conversation screen.

KMMessageStyle.receivedMessage = KMStyle(font: .systemFont(ofSize: 14), text: .blue) 
KMMessageStyle.sentMessage = KMStyle(font: .systemFont(ofSize: 14), text: .black) 

Navigation Bar's Color Customization

Use the below UINavigationBar.appearance code to change the navigation bar colors while launching the conversation.

let kmNavigationBarProxy = UINavigationBar.appearance(whenContainedInInstancesOf: [KMBaseNavigationViewController.self])
kmNavigationBarProxy.isTranslucent = false


kmNavigationBarProxy.barTintColor = UIColor(red:0.93, green:0.94, blue:0.95, alpha:1.0)


kmNavigationBarProxy.tintColor = UIColor.navigationTextOceanBlue() 


kmNavigationBarProxy.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.black] 

FAQ Button

To hide the FAQ button in Conversation List or Conversation screen, use below setting

Kommunicate.defaultConfiguration.hideFaqButtonInConversationList = true 
Kommunicate.defaultConfiguration.hideFaqButtonInConversationView = true 

Attachment Options

To hide all the attachment options(gallery, camera, video, contact, document and location), use optionsToShow config as shown below. All will be shown by default except contact.

Kommunicate.defaultConfiguration.chatBar.optionsToShow = .none


Kommunicate.defaultConfiguration.chatBar.optionsToShow = .some([.camera, .location])


Kommunicate.defaultConfiguration.chatBar.optionsToShow = .all




Kommunicate.defaultConfiguration.isNewSystemPhotosUIEnabled = true

We also have the option to record and send an audio message. To hide this option use hideAudioOptionInChatBar config.

Kommunicate.defaultConfiguration.hideAudioOptionInChatBar = true

Sending additional metadata with messages

If you want to send additional metadata with all the messages(sent from a device) then use messageMetadata config in your AppDelegate like this:

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

    let messageInfo = ["custom-key": "value"]
    do {
        let messageInfoData = try JSONSerialization.data(withJSONObject: messageInfo, options: .prettyPrinted)
        let messageInfoString = String(data: messageInfoData, encoding: .utf8) ?? ""

        Kommunicate.defaultConfiguration.messageMetadata = ["info": messageInfoString]
    } catch {
        print(error)
    }
    return true
}

Enable Speech to Text

The quality of the customer journey is everything in a product. STT will help you in enhancing the user experience and people with different learning styles prefer using these features, which is supported on iOS SDK. The Speech-to-Text feature can be enabled using the below setting:

This feature is disabled by default, to enable it, add the below script in the bottom of the Podfile and run pod install:

post_install do |installer|
  installer.pods_project.targets.each do |target|
    if target.name == 'ApplozicSwift'
      target.build_configurations.each do |config|
        config.build_settings['SWIFT_ACTIVE_COMPILATION_CONDITIONS'] ||= ['$(inherited)']
        config.build_settings['SWIFT_ACTIVE_COMPILATION_CONDITIONS'] << 'SPEECH_REC'
      end
    end
  end
end

Also add this Speech recognition usage entry in the project's Info.plist(open it as Source Code) file:

<key>NSSpeechRecognitionUsageDescriptionkey>
<string>Speech recognition will be used to determine which words you speak into the device's microphone.string>

Pass custom data to bot platform

To pass custom data with all the messages to the bot platform, use updateChatContext config as shown below:

let messageInfo = ["custom-key": "value"]
do {
    try Kommunicate.defaultConfiguration.updateChatContext(with: messageInfo)
} catch {
    print("Failed to update chat context: ", error)
}

Make your bot multilingual

If you want to set a user's language(to get bot replies in that language), then use updateUserLanguage config as shown below:

do {
    try Kommunicate.defaultConfiguration.updateUserLanguage(tag: "fr")
} catch {
    print("Failed to update user language: ", error)
}