首页 > 解决方案 > 如何在tableView swift的Xib Cell中创建内部视图动态

问题描述

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

视图控制器:

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()

    }

}

标签: iosswiftuitableviewxib

解决方案


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

在 tableviewcellForRowAt 方法中做如下

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 循环你想要多少个。

这里的行cell.stackviewOption.heightAnchor.constraint(equalToConstant: stackHeight).isActive = true for set stackview height. 用于stackHeight = stackHeight + 33.0在stackview的总高度中添加每次childview高度。

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


推荐阅读