自定义单元格可扩展的UiTableView

时间:2018-09-25 09:57:10

标签: ios uitableview

我有一个具有内部数组的数据集,我必须以Expand折叠方式显示该内部数组。

为此,我设计了2个nib文件。一个用于节,另一个用于节中的单元格。

我已经附加了UitableView和委托的方法。我成功地显示了Header视图,正在注册这样的Header视图。

let nib = UINib.init(nibName: "headerItemSavedListCell", bundle: nil)
self.lvSavedList.register(nib, forCellReuseIdentifier: "headerItemSavedListCell")

对于单元格,我正在使用以下方法

if(indexPath.row == 0){
    let header = Bundle.main.loadNibNamed("headerItemSavedListCell", owner: self, options: nil)?.first as! headerItemSavedListCell

    return header

}else{

    let cell = Bundle.main.loadNibNamed("ItemSavedListCell", owner: self, options: nil)?.first as! ItemSavedListCell

    return cell
}

但是它不起作用。

**所以我的问题是:**

  • 如何加载内部单元格视图?
  • 如何展开“板块”内部的折叠单元格视图?

如果您有有关可扩展Uitableview的任何教程,请提供帮助

1 个答案:

答案 0 :(得分:0)

我在这里使用的课程已连接到xibs

查看xib并绑定到类下 所以首先您必须像下面这样制作headerview

protocol HeaderDelegate:class{
func didSelectHeader(Header:HeaderFooter,at index:Int)
}

class HeaderFooter: UITableViewHeaderFooterView {
@IBOutlet weak var lblTitle: UILabel!

weak var delegate:HeaderDelegate?
var Expand = false

override func awakeFromNib() {
    let tap = UITapGestureRecognizer.init(target: self, action: #selector(didSelect(_:)))
    self.addGestureRecognizer(tap)
    self.isUserInteractionEnabled = true
}

@objc func didSelect(_ tap:UITapGestureRecognizer)
{
    delegate?.didSelectHeader(Header: self, at: self.tag)
}

override func prepareForReuse() {
    Expand = false
}
}

我在上方添加了轻击手势以检测headerViews上的触摸

下一步使单元格如下所示

class ExpandableCell: UITableViewCell {

var isExpanded = false
override func awakeFromNib() {
    super.awakeFromNib()
    isExpanded = false
    // Initialization code
}

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}

}

在您的视图控制器中

tblView.register(UINib.init(nibName: "HeaderFooter", bundle: nil), forHeaderFooterViewReuseIdentifier: "HeaderFooter")

在tablview dataSorce和Delegate方法中

func numberOfSections(in tableView: UITableView) -> Int {
    return numberofsections
}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return numberofrows
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    guard let cell = tableView.dequeueReusableCell(withIdentifier: "ExpandableCell") as? ExpandableCell else {
        return UITableViewCell()
    }
    //configure cell here
    return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    guard let header = tableView.headerView(forSection: indexPath.section) as? HeaderFooter
        else {return 0}
    if header.Expand
    {
        return UITableViewAutomaticDimension
    }
    else
    {
        return 0
    }
}

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return UITableViewAutomaticDimension
}
func tableView(_ tableView: UITableView, estimatedHeightForHeaderInSection section: Int) -> CGFloat {
     return 50
}
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {

}

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    guard let headerView = tableView.dequeueReusableHeaderFooterView(withIdentifier: "HeaderFooter") as? HeaderFooter else {return nil}
    //configure header View here
    headerView.tag = section
    return headerView
}
//MARK:-headerDelegate
func didSelectHeader(Header: HeaderFooter, at index: Int) {
    Header.Expand = !Header.Expand
    //comment below part if you dont want to collapse other rows when other section opened
    for i in 0..<tblView.numberOfSections
    {
        if i != index
        {
            guard let header = tblView.headerView(forSection: i) as? HeaderFooter else {return}
            header.Expand = false
            for j in 0..<tblView.numberOfRows(inSection: i)
            {
                tblView.reloadRows(at: [IndexPath.init(row: j, section: i)], with: .automatic)
            }
        }
        else
        {
            for j in 0..<tblView.numberOfRows(inSection: i)
            {
                tblView.reloadRows(at: [IndexPath.init(row: j, section: i)], with: .automatic)
            }
        }
    }
}