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

Question

I have created custom Cell Xib for tableView and its working fine dynamically. If I set numberofRowsInSection return 2 count it will display two cells within tableView. Actually I want to achieve list should append within same cell kind of tree view. screen shot attached.

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 Code:

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

in your xib cell add vertical stackView. now create custom UiView in another .xib file for your footer list.

in tableview cellForRowAt method do like below

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

here ChildView is footerview .xib and stackviewOption is vertical stackview. for loop for how many you want fotter.

here line cell.stackviewOption.heightAnchor.constraint(equalToConstant: stackHeight).isActive = true for set stackview height. line stackHeight = stackHeight + 33.0 for add everytime childview height in total height of stackview.

Do the same logic for cell that should work.

Answer 2

Set your tableview height in heightforrowAt to UITableView.automaticDimension .

Make your top view inside UIView (lets call it view1) . Set its height to 0 with priority to 750 , now child inside view1 will give the height to view1 . Make outlet of bottom constraint of last child inside view1 .

Disabling of bottom constraints will help you in hiding view1 since we are first setting height to 0 and expecting child items to provide height . When we are disabling bottom constraint , child items will not able to provide . Hence view1 will collapse to define height 0 .

Now for every cellforrowatIndexpath method call pass some parameters to hide or show top view .

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

Make sure to mark top view view1 to cliptobounds true and mBtmCnst to strong outlet .

Hope this helps you!