如何实现一个包含两个以上单元格的表视图单元格

How to implement a tableview cell that contains 2 more cells inside counts are not same(如何实现一个包含两个以上单元格的表视图单元格)

问题描述

我正在尝试实现这样的布局

1. 我的表视图有3个单元格(SubItemsCell(主单元格)、SubItemsListCell(主单元格内的n个产品)和noSubstituteCell(第二个单元格计数1之后的固定单元格))

2. SubItemsCell有一个选择按钮，该按钮将展开并显示SubItemsListCell，该单元格将作为(动态)主SubItems单元格下的任何产品计数加载。

3. 无替代单元格出现在n个产品加载之后。

我的预期结果是首先加载主单元格，即self.asivedProducts，当您单击每个已存档产品的选择按钮时，它将展开并加载self.newProducts和no替换静态单元格。因此主单元格与这两个单元格配对，并在我们仅展开时立即显示。

到目前为止，我只加载主单元格。我不知道下一步该做什么，请给我一个有代码或非常相似的例子的想法。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
 

  guard let cell = tableView.dequeueReusableCell(withIdentifier: "SubItemsCell", for: indexPath) as? SubItemsCell else {
        fatalError ("SubstituteItems Cell not found!")
   }
    
    let product = self.archivedProducts[indexPath.row]
    cell.titleLabel.text = product.title ?? ""
    cell.priceLabel.text = "AED (String(format: "%.2f", product.price ?? 0.00))"
    cell.scaleLabel.text = product.uom ?? ""
    cell.unavailableLabel.isHidden = false
    cell.selectBtn.isHidden = false
    let imageUrl = product.image?.url
    let escapedUrl = imageUrl?.replacingOccurrences(of: "\", with: "")
    let replacedUrl = "(escapedUrl ?? "")"
    let url = URL(string: replacedUrl)
    let plImage = UIImage(named: "whiteBg")
    DispatchQueue.main.async {
    cell.thumbImage.kf.setImage(with: url, placeholder: plImage, options: [.transition(.fade(0.2))])
    }

}

推荐答案

我认为您不需要嵌套表视图。您可以使用其他元素来实现上述功能。为了实现上述布局，我的建议如下：

1. 将您的UITableViewCell细分为至少两种不同的格式。有很多方法可以做到这一点，我的建议是使用CocoaTouch类w/xib(tutorial here)，这样您就可以细致地处理布局和约束：

a.CellWDropdown(显示的单元格#1)：您有一个单元格原型，它将包括图像、相关的3个标签和一个作为下拉菜单并将调用UIPickerView的按钮。

b.CellWStepper(单元格#2和#3)：您将拥有您的图像和2个标签，以及用于+/-按钮的UIStepper

C.LastCell(4号单元格如果是单元格？它也可以是一个视图)：同样地，创建所需的UI元素并适当地约束它们。

2. 注册您创建的nib文件：

tableView.register(UINib(nibName: "CellWDropDown", bundle: nil), forCellReuseIdentifier: "cellWDropdownIdentifier")

3. 在cell ForRowAt方法中，您可以调用上面创建的XIB来基于索引或所需的单元格类型创建单元格视图，例如：

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if indexPath.row == 0 {
         let cell = tableView.dequeueReusableCell(withIdentifier: cellWDropdownIdentifier, for: indexPath) as! CellWDropdown
    }
    else if(indexPath.row == 1 || indexPath.row == 2){
         let cell = tableView.dequeueReusableCell(withIdentifier: cellWStepperIdentifier, for: indexPath) as! CellWStepper
    }
    //do other actions/styling
}

4. 挂钩您创建的NIB和UITableView控制器之间的委托关系/方法。这将转到特定于应用程序的应用程序。

有很多细节需要填补，但这应该会对入门工作产生重大影响

这篇关于如何实现一个包含两个以上单元格的表视图单元格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！