Skip to content

Tutorial_Setup_BaseChatViewController

Victor Shamanov edited this page Jul 13, 2020 · 4 revisions

Tutorial: how to setup your ChatViewController

1. Subclass BaseChatViewController

import Chatto
import ChattoAdditions

class ChatViewController: BaseChatViewController {
}

2. Provide a input view by overriding createChatInputView

var chatInputPresenter: BasicChatInputBarPresenter!
override func createChatInputView() -> UIView {
    let chatInputView = ChatInputBar.loadNib()
    var appearance = ChatInputBarAppearance()
    appearance.sendButtonAppearance.title = NSLocalizedString("Send", comment: "")
    appearance.textInputAppearance.placeholderText = NSLocalizedString("Type a message", comment: "")
    self.chatInputPresenter = BasicChatInputBarPresenter(chatInputBar: chatInputView, chatInputItems: self.createChatInputItems(), chatInputBarAppearance: appearance)
    chatInputView.maxCharactersCount = 1000
    return chatInputView
}

func createChatInputItems() -> [ChatInputItemProtocol] {
    var items = [ChatInputItemProtocol]()
    items.append(self.createTextInputItem())
    items.append(self.createPhotoInputItem())
    return items
}

private func createTextInputItem() -> TextChatInputItem {
    let item = TextChatInputItem()
    item.textInputHandler = { [weak self] text in
      // Your handling logic
    }
    return item
}

private func createPhotoInputItem() -> PhotosChatInputItem {
    let item = PhotosChatInputItem(presentingController: self)
    item.photoInputHandler = { [weak self] image, imageSource in
      // Your handling logic
    }
    return item
}

Learn more about ChatInputBar

3. Map messages to presenters by overriding createPresenterBuilders

override func createPresenterBuilders() -> [ChatItemType: [ChatItemPresenterBuilderProtocol]] {
    let textMessagePresenter = TextMessagePresenterBuilder(
        viewModelBuilder: DemoTextMessageViewModelBuilder(),
        interactionHandler: DemoTextMessageHandler(baseHandler: self.baseMessageHandler)
    )
    textMessagePresenter.baseMessageStyle = BaseMessageCollectionViewCellAvatarStyle()

    let photoMessagePresenter = PhotoMessagePresenterBuilder(
        viewModelBuilder: DemoPhotoMessageViewModelBuilder(),
        interactionHandler: DemoPhotoMessageHandler(baseHandler: self.baseMessageHandler)
    )
    photoMessagePresenter.baseCellStyle = BaseMessageCollectionViewCellAvatarStyle()

    return [
        "text-message-type": [textMessagePresenter],
        "photo-message-type": [photoMessagePresenter],
    ]
}

Learn more about Presenters

4. Setup the data source

override func viewDidLoad() {
    super.viewDidLoad()
    self.chatDataSource = YourDataSource()
}

Learn more about Data source