badoo / badoo/Chatto

How do I make autosizing custom cell?

Open
#539 8 comments 5 reactions 0 assignees View on GitHub
Dominant language
Swift
Stars
4.6k
Forks
588
PR merge metrics
No merged PRs in 30d

Description

I've followed the tutorial and guideline and stuff, finally managed to create a chatVC with my custom cell. However, there's this autosizing issue where I don't know how to make it work.

Setup:

```
final class ChatContentCVC: BaseChatViewController {
override var canBecomeFirstResponder: Bool { return false }
override func createChatInputView() -> UIView { return UIView() }

override func createPresenterBuilders() -> [ChatItemType: [ChatItemPresenterBuilderProtocol]] {
return [ChatMessageModel.type: [ChatMsgPresenterBuilder()]
}
}
```
Where `ChatMessageModel` & `ChatMsgPresenterBuilder` is my custom model & builder. Typpically, I don't want to inherit or import the `ChattoAdditions`, so I built my own text message cell, and it works, until...

The Presenter.
```
final class ChatMsgPresenter: ChatItemPresenterProtocol {

let msgModel: ChatMessageModel
private weak var sizingCell: ChatMsgCVCell?

init (msgModel: ChatMessageModel, sizingCell: ChatMsgCVCell) {
self.msgModel = msgModel
self.sizingCell = sizingCell
}

static func registerCells(_ collectionView: UICollectionView) {
let sending = ChatMsgCVCell.sendingCellId
let receiving = ChatMsgCVCell.receivingCellId
collectionView.register(UINib(nibName: sending, bundle: Bundle(for: self)), forCellWithReuseIdentifier: sending)
collectionView.register(UINib(nibName: receiving, bundle: Bundle(for: self)), forCellWithReuseIdentifier: receiving)
}

func dequeueCell(collectionView: UICollectionView, indexPath: IndexPath) -> UICollectionViewCell {

let cellId = msgModel.owner == .me ? ChatMsgCVCell.sendingCellId : ChatMsgCVCell.receivingCellId
return collectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath)
}

func configureCell(_ cell: UICollectionViewCell, decorationAttributes: ChatItemDecorationAttributesProtocol?) {
guard let cell = cell as? ChatMsgCVCell else { return }
cell.fillData(msgModel)
}

var canCalculateHeightInBackground: Bool {
return false
}

```

Now's the tricky part and also the question of this issue: calculate cell's autosizing height
```
func heightForCell(maximumWidth width: CGFloat, decorationAttributes:
ChatItemDecorationAttributesProtocol?) -> CGFloat {
// How should I get dynamic sizing here?
// Should I cache the layout like ChattoAdditions' TextMessageCollectionViewCell?
// I've created my own sizingCell, but it doesn't seem to work.
// Also, using sizingCell might freeze the app if var canCalculateHeightInBackground = false
return 90 // hard code works okay, but not autosizing is a big problem.
}
```

Contributor guide

Open the contributing guide

Research direction

Start with ChatItemPresenterProtocol and the custom ChatMsgPresenter implementation, especially heightForCell(maximumWidth:decorationAttributes:) and the sizingCell property. Compare this path with ChattoAdditions' TextMessageCollectionViewCell sizing behavior. Done means the custom cell returns its dynamic height instead of the hard-coded 90 without freezing background layout.

Written by the indexing model from the issue text.

Assessment

Tech stack
swift
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.