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

Posted 2023-02-26

【中文标题】如何在tableView swift的Xib Cell中创建内部视图动态

【英文标题】：How to create inner view dynamic in Xib Cell of tableView swift

【发布时间】：2020-01-20 09:27:15

【问题描述】：

我已经为 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()

    

【问题讨论】：

您可以在单元格中添加堆栈视图，然后在堆栈中添加子视图。

你试过在单元格中添加tableview，它应该可以工作吗？

@RuchiMakadia 你能给我举个例子吗？

@SanadBarjawi 不，我没试过。我该如何使用它？

检查工作是否正常请投票回答。这是链接github.com/RuchiMakadia/DemoTeste。

【参考方案1】：

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

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

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

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

【讨论】：

谢谢你让我实现它并回复你。

我已经实现了在count 和constraint 上出现两个错误我可以在 GitHub 上分享我的代码吗？

计数是针对您的 childview 的数组。我的意思是 swiftprogramming 和跨平台文本的数组

计数错误我已将其设置为 URL 计数。约束错误：Cannot invoke 'constraint' with an argument list of type '(equalToConstant: Int)'

请原谅我再次打扰。我可以问一个问题，因为它与您共享的代码相关吗？

【参考方案2】：

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

在UIView 中制作您的顶视图（我们称之为view1）。将其高度设置为 0 优先级为 750 ，现在view1 中的子级将高度设置为view1。在view1 内制作最后一个孩子的底部约束的出口。

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

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

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

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

希望对您有所帮助！