|
|
|
@ -5,8 +5,8 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
|
|
|
|
|
static let reuseIdentifier = "ConversationCell"
|
|
|
|
|
|
|
|
|
|
// MARK: Components
|
|
|
|
|
private let accentView = UIView()
|
|
|
|
|
// MARK: UI Components
|
|
|
|
|
private let accentLineView = UIView()
|
|
|
|
|
|
|
|
|
|
private lazy var profilePictureView = ProfilePictureView()
|
|
|
|
|
|
|
|
|
@ -18,6 +18,25 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
return result
|
|
|
|
|
}()
|
|
|
|
|
|
|
|
|
|
private lazy var unreadCountView: UIView = {
|
|
|
|
|
let result = UIView()
|
|
|
|
|
result.backgroundColor = Colors.text.withAlphaComponent(Values.veryLowOpacity)
|
|
|
|
|
let size = ConversationCell.unreadCountViewSize
|
|
|
|
|
result.set(.width, to: size)
|
|
|
|
|
result.set(.height, to: size)
|
|
|
|
|
result.layer.masksToBounds = true
|
|
|
|
|
result.layer.cornerRadius = size / 2
|
|
|
|
|
return result
|
|
|
|
|
}()
|
|
|
|
|
|
|
|
|
|
private lazy var unreadCountLabel: UILabel = {
|
|
|
|
|
let result = UILabel()
|
|
|
|
|
result.font = .boldSystemFont(ofSize: Values.verySmallFontSize)
|
|
|
|
|
result.textColor = Colors.text
|
|
|
|
|
result.textAlignment = .center
|
|
|
|
|
return result
|
|
|
|
|
}()
|
|
|
|
|
|
|
|
|
|
private lazy var timestampLabel: UILabel = {
|
|
|
|
|
let result = UILabel()
|
|
|
|
|
result.font = .systemFont(ofSize: Values.smallFontSize)
|
|
|
|
@ -40,13 +59,14 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
private lazy var statusIndicatorView: UIImageView = {
|
|
|
|
|
let result = UIImageView()
|
|
|
|
|
result.contentMode = .scaleAspectFit
|
|
|
|
|
result.layer.cornerRadius = ConversationCell.conversationCellStatusIndicatorSize / 2
|
|
|
|
|
result.layer.cornerRadius = ConversationCell.statusIndicatorSize / 2
|
|
|
|
|
result.layer.masksToBounds = true
|
|
|
|
|
return result
|
|
|
|
|
}()
|
|
|
|
|
|
|
|
|
|
// MARK: Settings
|
|
|
|
|
private static let conversationCellStatusIndicatorSize: CGFloat = 14
|
|
|
|
|
private static let unreadCountViewSize: CGFloat = 20
|
|
|
|
|
private static let statusIndicatorSize: CGFloat = 14
|
|
|
|
|
|
|
|
|
|
// MARK: Initialization
|
|
|
|
|
override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
|
|
|
|
@ -61,23 +81,27 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
|
|
|
|
|
private func setUpViewHierarchy() {
|
|
|
|
|
let cellHeight: CGFloat = 68
|
|
|
|
|
// Set the cell background color
|
|
|
|
|
// Background color
|
|
|
|
|
backgroundColor = Colors.cellBackground
|
|
|
|
|
// Set up the highlight color
|
|
|
|
|
// Highlight color
|
|
|
|
|
let selectedBackgroundView = UIView()
|
|
|
|
|
selectedBackgroundView.backgroundColor = Colors.cellSelected
|
|
|
|
|
self.selectedBackgroundView = selectedBackgroundView
|
|
|
|
|
// Set up the accent view
|
|
|
|
|
accentView.set(.width, to: Values.accentLineThickness)
|
|
|
|
|
accentView.set(.height, to: cellHeight)
|
|
|
|
|
// Set up the profile picture view
|
|
|
|
|
// Accent line view
|
|
|
|
|
accentLineView.set(.width, to: Values.accentLineThickness)
|
|
|
|
|
accentLineView.set(.height, to: cellHeight)
|
|
|
|
|
// Profile picture view
|
|
|
|
|
let profilePictureViewSize = Values.mediumProfilePictureSize
|
|
|
|
|
profilePictureView.set(.width, to: profilePictureViewSize)
|
|
|
|
|
profilePictureView.set(.height, to: profilePictureViewSize)
|
|
|
|
|
profilePictureView.size = profilePictureViewSize
|
|
|
|
|
// Set up the label stack view
|
|
|
|
|
// Unread count view
|
|
|
|
|
unreadCountView.addSubview(unreadCountLabel)
|
|
|
|
|
unreadCountLabel.pin(to: unreadCountView)
|
|
|
|
|
unreadCountLabel.text = "4"
|
|
|
|
|
// Label stack view
|
|
|
|
|
let topLabelSpacer = UIView.hStretchingSpacer()
|
|
|
|
|
let topLabelStackView = UIStackView(arrangedSubviews: [ displayNameLabel, topLabelSpacer, timestampLabel ])
|
|
|
|
|
let topLabelStackView = UIStackView(arrangedSubviews: [ displayNameLabel, unreadCountView, topLabelSpacer, timestampLabel ])
|
|
|
|
|
topLabelStackView.axis = .horizontal
|
|
|
|
|
topLabelStackView.alignment = .center
|
|
|
|
|
topLabelStackView.spacing = Values.smallSpacing / 2 // Effectively Values.smallSpacing because there'll be spacing before and after the invisible spacer
|
|
|
|
@ -92,42 +116,41 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
let labelContainerView = UIView()
|
|
|
|
|
labelContainerView.addSubview(topLabelStackView)
|
|
|
|
|
labelContainerView.addSubview(bottomLabelStackView)
|
|
|
|
|
// Set up the main stack view
|
|
|
|
|
let stackView = UIStackView(arrangedSubviews: [ accentView, profilePictureView, labelContainerView ])
|
|
|
|
|
// Main stack view
|
|
|
|
|
let stackView = UIStackView(arrangedSubviews: [ accentLineView, profilePictureView, labelContainerView ])
|
|
|
|
|
stackView.axis = .horizontal
|
|
|
|
|
stackView.alignment = .center
|
|
|
|
|
stackView.spacing = Values.mediumSpacing
|
|
|
|
|
contentView.addSubview(stackView)
|
|
|
|
|
// Set up the constraints
|
|
|
|
|
accentView.pin(.top, to: .top, of: contentView)
|
|
|
|
|
accentView.pin(.bottom, to: .bottom, of: contentView)
|
|
|
|
|
// The three lines below are part of a workaround for a weird layout bug
|
|
|
|
|
topLabelStackView.set(.width, to: UIScreen.main.bounds.width - Values.accentLineThickness - Values.mediumSpacing - profilePictureViewSize - Values.mediumSpacing - Values.mediumSpacing)
|
|
|
|
|
// Constraints
|
|
|
|
|
accentLineView.pin(.top, to: .top, of: contentView)
|
|
|
|
|
accentLineView.pin(.bottom, to: .bottom, of: contentView)
|
|
|
|
|
timestampLabel.setContentCompressionResistancePriority(.required, for: NSLayoutConstraint.Axis.horizontal)
|
|
|
|
|
// HACK: The six lines below are part of a workaround for a weird layout bug
|
|
|
|
|
topLabelStackView.set(.width, to: UIScreen.main.bounds.width - Values.accentLineThickness - profilePictureViewSize - 3 * Values.mediumSpacing)
|
|
|
|
|
topLabelStackView.set(.height, to: 20)
|
|
|
|
|
topLabelSpacer.set(.height, to: 20)
|
|
|
|
|
timestampLabel.setContentCompressionResistancePriority(.required, for: NSLayoutConstraint.Axis.horizontal)
|
|
|
|
|
// The three lines below are part of a workaround for a weird layout bug
|
|
|
|
|
bottomLabelStackView.set(.width, to: UIScreen.main.bounds.width - Values.accentLineThickness - Values.mediumSpacing - profilePictureViewSize - Values.mediumSpacing - Values.mediumSpacing)
|
|
|
|
|
bottomLabelStackView.set(.width, to: UIScreen.main.bounds.width - Values.accentLineThickness - profilePictureViewSize - 3 * Values.mediumSpacing)
|
|
|
|
|
bottomLabelStackView.set(.height, to: 18)
|
|
|
|
|
bottomLabelSpacer.set(.height, to: 18)
|
|
|
|
|
statusIndicatorView.set(.width, to: ConversationCell.conversationCellStatusIndicatorSize)
|
|
|
|
|
statusIndicatorView.set(.height, to: ConversationCell.conversationCellStatusIndicatorSize)
|
|
|
|
|
statusIndicatorView.set(.width, to: ConversationCell.statusIndicatorSize)
|
|
|
|
|
statusIndicatorView.set(.height, to: ConversationCell.statusIndicatorSize)
|
|
|
|
|
snippetLabel.pin(to: snippetLabelContainer)
|
|
|
|
|
typingIndicatorView.pin(.leading, to: .leading, of: snippetLabelContainer)
|
|
|
|
|
typingIndicatorView.centerYAnchor.constraint(equalTo: snippetLabel.centerYAnchor).isActive = true
|
|
|
|
|
// Not using a stack view for this is part of a workaround for a weird layout bug
|
|
|
|
|
// HACK: Not using a stack view for this is part of a workaround for a weird layout bug
|
|
|
|
|
topLabelStackView.pin(.leading, to: .leading, of: labelContainerView)
|
|
|
|
|
topLabelStackView.pin(.top, to: .top, of: labelContainerView, withInset: 12)
|
|
|
|
|
topLabelStackView.pin(.trailing, to: .trailing, of: labelContainerView)
|
|
|
|
|
bottomLabelStackView.pin(.leading, to: .leading, of: labelContainerView)
|
|
|
|
|
bottomLabelStackView.pin(.top, to: .bottom, of: topLabelStackView, withInset: 6)
|
|
|
|
|
labelContainerView.pin(.bottom, to: .bottom, of: bottomLabelStackView, withInset: 12)
|
|
|
|
|
// The two lines below are part of a workaround for a weird layout bug
|
|
|
|
|
// HACK: The two lines below are part of a workaround for a weird layout bug
|
|
|
|
|
labelContainerView.set(.width, to: UIScreen.main.bounds.width - Values.accentLineThickness - Values.mediumSpacing - profilePictureViewSize - Values.mediumSpacing - Values.mediumSpacing)
|
|
|
|
|
labelContainerView.set(.height, to: cellHeight)
|
|
|
|
|
stackView.pin(.leading, to: .leading, of: contentView)
|
|
|
|
|
stackView.pin(.top, to: .top, of: contentView)
|
|
|
|
|
// The two lines below are part of a workaround for a weird layout bug
|
|
|
|
|
// HACK: The two lines below are part of a workaround for a weird layout bug
|
|
|
|
|
stackView.set(.width, to: UIScreen.main.bounds.width - Values.mediumSpacing)
|
|
|
|
|
stackView.set(.height, to: cellHeight)
|
|
|
|
|
}
|
|
|
|
@ -144,12 +167,17 @@ final class ConversationCell : UITableViewCell {
|
|
|
|
|
isBlocked = false
|
|
|
|
|
}
|
|
|
|
|
if isBlocked {
|
|
|
|
|
accentView.backgroundColor = Colors.destructive
|
|
|
|
|
accentView.alpha = 1
|
|
|
|
|
accentLineView.backgroundColor = Colors.destructive
|
|
|
|
|
accentLineView.alpha = 1
|
|
|
|
|
} else {
|
|
|
|
|
accentView.backgroundColor = Colors.accent
|
|
|
|
|
accentView.alpha = threadViewModel.hasUnreadMessages ? 1 : 0.0001 // Setting the alpha to exactly 0 causes an issue on iOS 12
|
|
|
|
|
}
|
|
|
|
|
accentLineView.backgroundColor = Colors.accent
|
|
|
|
|
accentLineView.alpha = threadViewModel.hasUnreadMessages ? 1 : 0.0001 // Setting the alpha to exactly 0 causes an issue on iOS 12
|
|
|
|
|
}
|
|
|
|
|
unreadCountView.isHidden = !threadViewModel.hasUnreadMessages
|
|
|
|
|
let unreadCount = threadViewModel.unreadCount
|
|
|
|
|
unreadCountLabel.text = unreadCount < 100 ? "\(unreadCount)" : "99+"
|
|
|
|
|
let fontSize = (unreadCount < 100) ? Values.verySmallFontSize : 8
|
|
|
|
|
unreadCountLabel.font = .boldSystemFont(ofSize: fontSize)
|
|
|
|
|
profilePictureView.update(for: thread)
|
|
|
|
|
displayNameLabel.text = getDisplayName()
|
|
|
|
|
timestampLabel.text = DateUtil.formatDateShort(threadViewModel.lastMessageDate)
|
|
|
|
|