-
Notifications
You must be signed in to change notification settings - Fork 590
Tutorial_Add_Custom_Cell
You may want to create a cell from scratch to implement things like banners, time separators or your custom text cells.
Note that this is based just in Chatto framework, so from now on we're ignoring that ChattoAdditions even exits.
Let's say we want to create a time separator that appears before the first message sent on each day. The UI will be really simple: just a simple text centered with the date of the day.
-
TimeSeparatorCollectionViewCell: Subclass of
UICollectionViewCellwith our UI -
TimeSeparatorModel: A
ChatItemProtocolholding the data needed to configure the TimeSeparatorCollectionViewCell. -
TimeSeparatorPresenter: Will be responsible for configuring the
TimeSeparatorCollectionViewCellwith theTimeSeparatorModel. Besides, it will have to register the cell in the UICollectionView and provide the height needed to render the cell. Learn more about the responsabilities of Presenters -
TimeSeparatorPresenterBuilder: Will be responsible for creating a
TimeSeparatorPresentergiven aTimeSeparatorModel. It will be used during the Update-flow
-
We need to tell Chatto that there's a time separator. We can do this in two ways:
-
Data-source approach, by just returning the
TimeSeparatorModels within itschatItemsproperty. -
Decorator approach, by inserting the
TimeSeparatorModels during the decoration phase of the Update-flow
-
Data-source approach, by just returning the
-
We also need to tell Chatto about
TimeSeparatorPresenterBuilderso it can create the presenters for eachTimeSeparatorModel. In your BaseChatViewController subclass, just make sure thatcreatePresenterBuildersincludesTimeSeparatorPresenterBuilder.
override func createPresenterBuilders() -> [ChatItemType: [ChatItemPresenterBuilderProtocol]] {
return [
/* Other types */
TimeSeparatorModel.chatItemType: [TimeSeparatorPresenterBuilder()]
]
}That's it!! As you can see, it's really easy to add new types of cells in a systematic and clean way!