TableView cell: Constraint change conflicts tableView.endUpdates() - swift

Question

I have a messaging application written in Swift.
It does have message bubbles: if the message is longer than 200 chars it is being shortened.
Whenever the user clicks on a message it gets selected:
If the message was shortened, I replace the text with the original long text: Therefore I need to call tableView.beginUpdates() and tableView.endUpdates()
Plus I have to change the timeLabel's height constraint with UIView.animate()
But the two seems to conflict each other, and makes a weird animation: (watch the end)
https://youtu.be/QLGtUg1AmFw
Code:
func selectWorldMessage(indexPath: IndexPath) {
if let cell = tableView.cellForRow(at: indexPath) as? WorldMessageCell {
cell.messageLabel.text = data[indexPath.row].originalMessage
self.lastContentOffsetY = self.tableView.contentOffset.y
self.tableView.beginUpdates()
UIView.animate(withDuration: duration) {
cell.timeLabelHeightConstraint.constant = 18
cell.layoutIfNeeded()
}
self.tableView.endUpdates()
self.lastContentOffsetY = nil
cell.layoutIfNeeded()
WorldMessageIdsStore.shared.nearby.saveCellHeight(indexPath: indexPath, height: cell.frame.size.height, expanded : true, depending: indexPath.section == 1 ? true : false )
}
}
#objc func deselectSelectedWorldMessage(){
if (currentSelectedIndexPath == nil){
return
}
let indexPath = currentSelectedIndexPath!
tableView.deselectRow(at: indexPath, animated: false)
if let cell = tableView.cellForRow(at: indexPath) as? WorldMessageCell {
cell.messageLabel.text = data[indexPath.row].shortenedMessage
self.lastContentOffsetY = self.tableView.contentOffset.y
self.tableView.beginUpdates()
UIView.animate(withDuration: duration) {
cell.timeLabelHeightConstraint.constant = 0
cell.layoutIfNeeded()
}
self.tableView.endUpdates()
self.lastContentOffsetY = nil
cell.layoutIfNeeded()
}
currentSelectedIndexPath = nil
}
Is there a way to animate cell height change & constraint change in the same time?
I can not place self.tableView.beginUpdates() and self.tableView.endUpdates() in the UIView.animate(){ ... } part, because it would cause the new appearing rows to flicker.
.
.
.
UPDATE 1
So If I palce the self.tableView.beginUpdates() and self.tableView.endUpdates() inside the UIView.animate(){ ... }, then the animation works fine. But as I mentioned it causes flicker when new rows are appearing.
Video:
https://youtu.be/8Sex3DoESkQ
UPDATE 2 !!
So If I set the UIview.animate's duration to 0.3 everything works fine. I don't really understand why.

Answer 1

This animation can be sticky.
I think your main problem here is bubble shrinking more then it should. If you run your animation in slow animation mode (By the way, the simulator has this option, very useful for debugging) you will notice:
To sort this out, you can make your label vertical content compression resistants
higher, and check label has top and bottom constraints with Hi priority too, so it would not get cut this way.
https://medium.com/#abhimuralidharan/ios-content-hugging-and-content-compression-resistance-priorities-476fb5828ef

Answer 2

Try using the following code to overcome flicking problem
tableView.scrollToRow(at: indexPath, at: UITableView.ScrollPosition.middle, animated: true)
Alternative solution
try using this handsome method to update your cell with animation instead of beginUpdates() and endUpdates() methods
tableView.reloadRows(at: [indexPath], with: UITableView.RowAnimation.bottom )