如何在 tableView 的 Xib Cell 中动态创建内部视图 swift

Question

我已经为 tableView 创建了自定义 Cell Xib，它动态地工作正常。如果我设置 numberofRowsInSection return 2 计数，它将在 tableView 中显示两个单元格。实际上我想实现列表应该附加在树视图的相同单元格类型中。附上屏幕截图。

ViewController:

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource, URLSessionDelegate {


    @IBOutlet weak var tableView: UITableView!
    let urlList = [
    ["The Swift Programming Language", "https://swift.org/documentation/"],
    ["Crossdomain.xml", "https://crossdomain.xml"]]

    var downloadTaskList: [DownloadTaskInfo]?


    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.dataSource = self
        tableView.delegate = self
        let nib = UINib.init(nibName: "DownloadEntryViewCell", bundle: nil)
        self.tableView.register(nib, forCellReuseIdentifier: "DownloadEntryViewCell")
    }

    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 140

    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return urlList.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "DownloadEntryViewCell", for: indexPath) as! DownloadEntryViewCell        
        cell.footerLbl1.text = urlList[indexPath.row][0]
        cell.footerPrg1.progress = 0.0
        return cell
    }

}

Xib代码：

class DownloadEntryViewCell: UITableViewCell {
    @IBOutlet weak var rightView: UIView!
    @IBOutlet weak var leftView: UIView!


    @IBOutlet weak var fileNameLabel: UILabel!
    @IBOutlet weak var downloadURLLabel: UILabel!
    @IBOutlet weak var progressLabel: UILabel!
    @IBOutlet weak var individualProgress: UIProgressView!
    @IBOutlet weak var imgView: UIImageView!



    @IBOutlet weak var footerView: UIView!
    @IBOutlet weak var h1View: UIView!
    @IBOutlet weak var v1View: UIView!
    @IBOutlet weak var footerLbl1: UILabel!
    @IBOutlet weak var footerProgressLabel: UILabel!
    @IBOutlet weak var footerPrg1: UIProgressView!
    @IBOutlet weak var PinView1: UIView!


    override func awakeFromNib() {
        super.awakeFromNib()

    }

}

Answer 1

将 heightforrowAt 中的 tableview 身高设置为 UITableView.automaticDimension 。

在 UIView 中创建俯视图（我们称之为视图 1）。将其高度设置为 0，优先级为 750，现在 view1 内的 child 会将高度赋予 view1。使 view1 内最后一个 child 底部约束的出口。

禁用底部约束将帮助您隐藏 view1，因为我们首先将高度设置为 0 并期望 child 项提供高度。当我们禁用底部约束时，child 项将无法提供。因此 view1 将折叠以定义高度 0 。

现在每个 cellforrowatIndexpath 方法调用传递一些参数来隐藏或显示顶部视图。

func configureUI(cellData:String? , showTopView:Bool){
    mBtmCnst.isActive = showTopView
}

确保将顶视图 view1 标记为 cliptobounds true 并将 mBtmCnst 标记为 strong 插座。

希望对您有所帮助！

Answer 2

在您的 xib 单元格中添加垂直 stackView。现在在另一个 .xib 文件中为您的页脚列表创建自定义 UiView。

在表视图中 cellForRowAt 方法如下所示

var stackHeight:CGFloat = 0.0
    for i in 1...ChildView.count
    {
        let child_view = Bundle.main.loadNibNamed("ChildView", owner: self, options: nil)?.first as! ChildView
        child_view.lblProgress.text = "Swift_programimg"
        cell.stackviewOption.addArrangedSubview(child_view)
         stackHeight = stackHeight + 60.0
    }
    cell.stackviewOption.heightAnchor.constraint(equalToConstant: stackHeight).isActive = true

这里ChildView是footerview .xib，stackviewOption是垂直stackview。 for循环你想要多少fotter。

此处行cell.stackviewOption.heightAnchor.constraint(equalToConstant: stackHeight).isActive = true for set stackview height. 第 stackHeight = stackHeight + 33.0 行用于将每次子视图高度添加到堆栈视图的总高度中。

对应该起作用的单元格执行相同的逻辑。

如何在 tableView 的 Xib Cell 中动态创建内部视图 swift

How to create inner view dynamic in Xib Cell of tableView swift

uitableview

xib

ios

swift