Most of the time, we take labels inside the collection view. We want the height of the collection view exactly equal to the label data height because it will not look good if the label data height is less than the collection view cell, it will show a blank space and if the label data height is more than the collection view then it will truncate the data.
Here I am discussing how to manage collection view cell height according to text label data.
Follow the steps :
Step 1: Go to the collection view cell class and create the outlet of the label.
|
1 2 3 |
class NewCollectionViewCell: UICollectionViewCell { @IBOutlet weak var myLbl: UILabel! } |
Step 2: Go to MainViewController and create the outlet of the collection view.
|
1 2 3 |
class ViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource , UICollectionViewDelegateFlowLayout { @IBOutlet weak var myCollectionView: UICollectionView! } |
Step 3: Now create the extension to calculate the height of the label.
|
1 2 3 4 5 6 7 8 |
extension UILabel { func textHeight(withWidth width: CGFloat) -> CGFloat { guard let text = text else { return 0 } return text.height(withWidth: UIScreen.main.bounds.width, font: UIFont.systemFont(ofSize: 17)) } } |
Step 4: Now Register the collection view cell so that we can use it.
|
1 2 3 4 5 6 |
override func viewDidLoad() { super.viewDidLoad() myCollectionView.delegate = self myCollectionView.dataSource = self myCollectionView.register(UINib.init(nibName: "NewCollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "NewCollectionViewCell") } |
Step 5: After registering the collection view cell write their All delegate and data source method inside main controller class.
|
1 2 3 |
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 1 } |
|
1 2 3 4 5 6 |
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { if let cell = myCollectionView.dequeueReusableCell(withReuseIdentifier: "NewCollectionViewCell", for: indexPath as IndexPath) as? NewCollectionViewCell { return cell } return UICollectionViewCell() } |
|
1 2 3 4 5 6 |
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { if let cell = myCollectionView.dequeueReusableCell(withReuseIdentifier: "NewCollectionViewCell", for: indexPath as IndexPath) as? NewCollectionViewCell { lblHeight = cell.myLbl.textHeight(withWidth: UIScreen.main.bounds.width) } return CGSize(width: UIScreen.main.bounds.width , height: lblHeight) } |
Step 6: Now your collection view cell height will automatically increase after calculating the height of the label.
So please follow the above step and if you have any issue or suggestion you can leave your query/suggestion in the comment section I will try to solve that.
return text.height(withWidth: UIScreen.main.bounds.width, font: UIFont.systemFont(ofSize: 17))
label has no member height