mirror of
https://github.com/oxen-io/session-ios.git
synced 2023-12-13 21:30:14 +01:00
ui: add expand react button
This commit is contained in:
parent
3239aa521e
commit
9d795d4bfb
2 changed files with 67 additions and 1 deletions
|
@ -37,10 +37,26 @@ final class ReactionContainerView : UIView {
|
||||||
stackView.axis = .horizontal
|
stackView.axis = .horizontal
|
||||||
stackView.spacing = Values.smallSpacing
|
stackView.spacing = Values.smallSpacing
|
||||||
stackView.alignment = .center
|
stackView.alignment = .center
|
||||||
for reaction in reactions {
|
|
||||||
|
var displayedReactions: [(String, (Int, Bool))]
|
||||||
|
var expandButtonReactions: [String]
|
||||||
|
|
||||||
|
if reactions.count >= 6 {
|
||||||
|
displayedReactions = Array(reactions[0...2])
|
||||||
|
expandButtonReactions = Array(reactions[3...5]).map{ $0.0 }
|
||||||
|
} else {
|
||||||
|
displayedReactions = reactions
|
||||||
|
expandButtonReactions = []
|
||||||
|
}
|
||||||
|
|
||||||
|
for reaction in displayedReactions {
|
||||||
let reactionView = ReactionView(emoji: reaction.0, value: reaction.1)
|
let reactionView = ReactionView(emoji: reaction.0, value: reaction.1)
|
||||||
stackView.addArrangedSubview(reactionView)
|
stackView.addArrangedSubview(reactionView)
|
||||||
}
|
}
|
||||||
|
if expandButtonReactions.count > 0 {
|
||||||
|
let expandButton = ExpandingReactionButton(emojis: expandButtonReactions)
|
||||||
|
stackView.addArrangedSubview(expandButton)
|
||||||
|
}
|
||||||
containerView.addArrangedSubview(stackView)
|
containerView.addArrangedSubview(stackView)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -54,3 +54,53 @@ final class ReactionView : UIView {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
final class ExpandingReactionButton: UIView {
|
||||||
|
private let emojis: [String]
|
||||||
|
|
||||||
|
// MARK: Settings
|
||||||
|
private let size: CGFloat = 22
|
||||||
|
private let margin: CGFloat = 15
|
||||||
|
|
||||||
|
// MARK: Lifecycle
|
||||||
|
init(emojis: [String]) {
|
||||||
|
self.emojis = emojis
|
||||||
|
super.init(frame: CGRect.zero)
|
||||||
|
setUpViewHierarchy()
|
||||||
|
}
|
||||||
|
|
||||||
|
override init(frame: CGRect) {
|
||||||
|
preconditionFailure("Use init(viewItem:textColor:) instead.")
|
||||||
|
}
|
||||||
|
|
||||||
|
required init?(coder: NSCoder) {
|
||||||
|
preconditionFailure("Use init(viewItem:textColor:) instead.")
|
||||||
|
}
|
||||||
|
|
||||||
|
private func setUpViewHierarchy() {
|
||||||
|
var rightMargin: CGFloat = 0
|
||||||
|
for emoji in self.emojis.reversed() {
|
||||||
|
let container = UIView()
|
||||||
|
container.set(.width, to: size)
|
||||||
|
container.set(.height, to: size)
|
||||||
|
container.backgroundColor = Colors.receivedMessageBackground
|
||||||
|
container.layer.cornerRadius = size / 2
|
||||||
|
container.layer.borderWidth = 1
|
||||||
|
container.layer.borderColor = isDarkMode ? UIColor.black.cgColor : UIColor.white.cgColor
|
||||||
|
|
||||||
|
let emojiLabel = UILabel()
|
||||||
|
emojiLabel.text = emoji
|
||||||
|
emojiLabel.font = .systemFont(ofSize: Values.verySmallFontSize)
|
||||||
|
|
||||||
|
container.addSubview(emojiLabel)
|
||||||
|
emojiLabel.center(in: container)
|
||||||
|
|
||||||
|
addSubview(container)
|
||||||
|
container.pin([ UIView.VerticalEdge.top, UIView.VerticalEdge.bottom ], to: self)
|
||||||
|
container.pin(.right, to: .right, of: self, withInset: -rightMargin)
|
||||||
|
rightMargin += margin
|
||||||
|
}
|
||||||
|
|
||||||
|
set(.width, to: rightMargin - margin + size)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue