动态CollectionViewCell在TableViewCell Swift中 [英] Dynamic CollectionViewCell In TableViewCell Swift

问题描述

如何制作 UITableViewCell 高度动态根据 UICollectionViewCell ？

How To Make UITableViewCell Height Dynamic according the UICollectionViewCell?

UIViewController

UIViewController

UITableView

UITableView

UITableViewCell

UITableViewCell

UICollectionView

UICollectionView

UICollectionViewCell1

UICollectionViewCell1

标签1

Label 1

UICollectionViewCell2

UICollectionViewCell2

标签2

Label 2

UICollectionViewCell3

UICollectionViewCell3

标签3

Label 3

[S o on]

说明：

此处 Label1 ， Label2 ，标签3 在 UICollectionView中有动态高度和 numberOfRows code>也是动态的。根据 UICollectionViewCell ，我需要 UITableViewCell 的高度。

Explanation:

Here Label1, Label2, label 3 are have dynamic height and numberOfRows in UICollectionView is also dynamic. I need Height of UITableViewCell according to the UICollectionViewCell.

推荐答案

在中查看层次结构UIViewController

View Hierarchy In UIViewController

1. 绑定代表和数据源

1. Bind Delegate And Datasource




• 使用<$ c $绑定 UItableView 委托和数据源c> UIViewController 。

• Bind UItableView Delegate and datasource with the UIViewController.

绑定 UICollectionView 委托和数据源与 UItableViewCell 此处 TblCell 。

Bind UICollectionView Delegate and datasource with the UItableViewCell here TblCell.

在 UIViewController

class CollectionVC: UIViewController, UITableViewDataSource, UITableViewDelegate {

:
:

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    return UITableViewAutomaticDimension // For tableCell Dynamic Height
}

func tableView(_ tableView: UITableView, estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat {
    return 200 // For tableCell Estimated Height
}
// Above two delegates must be necessary or you can use property for same.


func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 1 // returning 1, as per current single cell
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "TblCell") as! TblCell

    return cell
}
}

在 TblCell

class TblCell: UITableViewCell , UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout{

@IBOutlet var colViewObj: UICollectionView!

// Array for Label
var arrData = ["Hello", "How re you?", "rock the world", "Nice to meet you.", "Hey! It is awsome."]


override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code

    self.colViewObj.isScrollEnabled = false
}

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

     // Get width of Label As per String characters.
    let aWidth : CGFloat = arrData[indexPath.row].width(withConstraintedHeight: 40, font: UIFont.systemFont(ofSize: 17.0))

    return CGSize(width: aWidth + 40 , height: 40)
}

// THIS IS THE MOST IMPORTANT METHOD
//
// This method tells the auto layout
// You cannot calculate the collectionView content size in any other place, 
// because you run into race condition issues.

override func systemLayoutSizeFitting(_ targetSize: CGSize, withHorizontalFittingPriority horizontalFittingPriority: UILayoutPriority, verticalFittingPriority: UILayoutPriority) -> CGSize {

    // If the cell's size has to be exactly the content 
    // Size of the collection View, just return the
    // collectionViewLayout's collectionViewContentSize.

    self.colViewObj.frame = CGRect(x: 0, y: 0,
                                   width: targetSize.width, height: 600)
    self.colViewObj.layoutIfNeeded() 

    // It Tells what size is required for the CollectionView
    return self.colViewObj.collectionViewLayout.collectionViewContentSize

}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return arrData.count
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ColViewCell", for: indexPath) as! ColViewCell

    cell.lblTitle.text = arrData[indexPath.item]

    cell.lblTitle.layer.borderColor = UIColor.black.cgColor
    cell.lblTitle.layer.borderWidth = 1.0

    return cell
}

}

extension String {

func width(withConstraintedHeight height: CGFloat, font: UIFont) -> CGFloat {
    let constraintRect = CGSize(width: .greatestFiniteMagnitude, height: height)
    let boundingBox = self.boundingRect(with: constraintRect, options: .usesLineFragmentOrigin, attributes: [NSFontAttributeName: font], context: nil)

    return ceil(boundingBox.width)
}
}

输出：

• 红色边框：UITableViewCell


• 黄色边框：UICollectionViewCell



• 黑色轮廓：标签

  Output:

  • Red Border : UITableViewCell
  • Yellow Border : UICollectionViewCell

  • Black Outline : Label

    与UICollectionViewDelegateFlowLayout

    没有UICollectionViewDelegateFlowLayout

    UITableViewCell内的UICollectionView - 动态高度？

    这篇关于动态CollectionViewCell在TableViewCell Swift中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！