I am trying to self size DTAttributedTextContentView inside the collection cell based on its attributed text. The problem I face is that when I set attributedTextContentView width constraints like so:
attributedTextContentView.widthAnchor.constraint(lessThanOrEqualToConstant: 260)
it applies the whole constant width (in this case 260) to the textContentView, even if attributedString length is smaller than the width, leaving some extra space:
My question is, how to size the frame of DTAttributedTextContentView so that it just encloses the text that it contains?
Initially I used basic UITextView, but the scrolling of cells through collection view is not that smooth when there are multiple cells, and also it gives possibility to easy access the last line of the text inside, which I need for my app, so I would like to stick to DTAttributedTextContentView.
Here is the sample code for testing:
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
configureCollectionView()
}
// MARK: - Collection view setup
let collectionView: UICollectionView = {
let layout = UICollectionViewCompositionalLayout { (section, environment) -> NSCollectionLayoutSection? in
let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0), heightDimension: .estimated(10))
let item = NSCollectionLayoutItem(layoutSize: itemSize)
let group = NSCollectionLayoutGroup.vertical(layoutSize: itemSize, subitems: [item])
let section = NSCollectionLayoutSection(group: group)
section.interGroupSpacing = 5
return section
}
layout.configuration.scrollDirection = .vertical
let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
collectionView.register(ConversationCollectionViewCell.self, forCellWithReuseIdentifier: "ConversationCell")
return collectionView
}()
private func configureCollectionView() {
collectionView.dataSource = self
collectionView.backgroundColor = .brown
view.addSubview(collectionView)
collectionView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
collectionView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
collectionView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
collectionView.topAnchor.constraint(equalTo: view.topAnchor),
collectionView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])
}
}
// MARK: - Collection Data Source
extension ViewController: UICollectionViewDataSource {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 10
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ConversationCell", for: indexPath) as! ConversationCollectionViewCell
return cell
}
}
// MARK: - Collection View Custon Cell
final class ConversationCollectionViewCell: UICollectionViewCell, DTAttributedTextContentViewDelegate {
var mainCellContainerView = UIView()
var attributedTextContentView = DTAttributedTextContentView()
//MARK: - LIFECYCLE
override init(frame: CGRect) {
super.init(frame: frame)
setupmainCellContainerView()
setupAttributedTextContentView()
layoutIfNeeded()
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
// MARK: - UI STEUP
private func setupmainCellContainerView() {
contentView.addSubview(mainCellContainerView)
mainCellContainerView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
mainCellContainerView.topAnchor.constraint(equalTo: contentView.topAnchor),
mainCellContainerView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
mainCellContainerView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
mainCellContainerView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
])
}
private func setupAttributedTextContentView() {
mainCellContainerView.addSubview(attributedTextContentView)
attributedTextContentView.backgroundColor = .systemIndigo
attributedTextContentView.delegate = self
attributedTextContentView.sizeToFit()
let attributedString = NSAttributedString(string: "Simple message for testing purpose @", attributes: [
.font: UIFont(name: "HelveticaNeue", size: 17),
.foregroundColor: UIColor.white,
.paragraphStyle: {
let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.alignment = .left
paragraphStyle.lineBreakMode = .byWordWrapping
return paragraphStyle
}()
])
attributedTextContentView.attributedString = attributedString
attributedTextContentView.contentMode = .redraw
attributedTextContentView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
attributedTextContentView.widthAnchor.constraint(lessThanOrEqualToConstant: 260),
attributedTextContentView.topAnchor.constraint(equalTo: mainCellContainerView.topAnchor),
attributedTextContentView.bottomAnchor.constraint(equalTo: mainCellContainerView.bottomAnchor),
])
}
}