[iOS] MessageKitでAvatarViewの上にラベルを表示する

公開日：2018/11/10

なかなか苦戦したのでめも。

むりやりUILabelを追加して表示してる。
masksToBounds = falseにしてるので丸く映らなくなる副作用あり。

func configureAvatarView(_ avatarView: AvatarView, for message: MessageType, at indexPath: IndexPath, in messagesCollectionView: MessagesCollectionView) {
    let avatar = Avatar(image: ownerIcon(roomDocumentId: roomDocumentId, userId: userId), initials: initial)
    avatarView.set(avatar: avatar)
    let number = String(describing: indexPath.section + 1)
    if let abobeLabel = viewWithTag(AvatarView.labelTag) as? UILabel {
        abobeLabel.text = number
        return
    }
    let abobeLabel = UILabel(frame: CGRect(x: 0, y: -10, width: frame.width, height: 14))
    abobeLabel.textAlignment = .center
    abobeLabel.text = number
    abobeLabel.font = UIFont.systemFont(ofSize: 11)
    abobeLabel.tag = AvatarView.labelTag
    addSubview(abobeLabel)
    // これをやらないと丸くきりとられているため、ラベルが表示されない
    layer.masksToBounds = false
}

extension AvatarView {
    static let labelTag = 10
}

func configureAvatarView(_ avatarView: AvatarView, for message: MessageType, at indexPath: IndexPath, in messagesCollectionView: MessagesCollectionView) {