Search code examples
iosswiftuitableviewxib

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


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

    }

}

Solution

  • 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.