ios - 如何制作可展开的表格 View 以显示iOS的其余详细信息？

我想利用可扩展表格视图在用户点击单元格时显示表格单元格的其余部分。目前，我的要求如下所示:

上面显示的单元格处于展开状态，而下面的单元格处于未展开状态。

目前，我正计划使用布尔(Bool)检查单元是否已扩展。

请帮助我解决Swift3中的问题。

目前，我打算使用代码:这是自定义单元格类:

import UIKit

protocol OptionButtonsDelegate{
    func closeFriendsTapped(at index:IndexPath)
}

class ExpandingTableViewCellContent {
    var title: String?
    var subtitle: String?
    var expanded: Bool

    init(title: String, subtitle: String) {
        self.title = title
        self.subtitle = subtitle
        self.expanded = false
    }
}

class ExpandingTableViewCell: UITableViewCell {

    @IBOutlet var titleLabel: UILabel!
    @IBOutlet var subtitleLabel: UILabel!
    var delegate:OptionButtonsDelegate!
    var indexPath:IndexPath!

    @IBOutlet weak var buttonClick: UIButton!
    override func awakeFromNib() {
        super.awakeFromNib()
    }

    @IBAction func buttonAction(_ sender: UIButton) {


        self.delegate?.closeFriendsTapped(at: indexPath)
    }
    func set(content: ExpandingTableViewCellContent) {
        self.titleLabel.text = content.title
        self.subtitleLabel.text = content.expanded ? content.subtitle : ""
        if content.expanded {
            self.buttonClick.isHidden = false
            self.backgroundColor = UIColor.orange
        }
        else
        {
            self.buttonClick.isHidden = true
            self.backgroundColor = UIColor.red
        }

    }
}

视图控制器类代码为:

    import UIKit

class ViewController: UIViewController,OptionButtonsDelegate {

    @IBOutlet var tableView: UITableView!
    var datasource = [ExpandingTableViewCellContent]()

    @IBOutlet weak var buttonClick: UIButton!
    override func viewDidLoad() {
        super.viewDidLoad()

        tableView.dataSource = self
        tableView.delegate = self
        tableView.tableFooterView = UIView() // Removes empty cell separators
        tableView.estimatedRowHeight = 60
        tableView.rowHeight = UITableViewAutomaticDimension

        datasource = [ExpandingTableViewCellContent(title: "Vestibulum id ligula porta felis euismod semper.",
                                                    subtitle: "Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas sed diam eget risus varius blandit sit amet non magna."),
                      ExpandingTableViewCellContent(title: "Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis .",
                                                    subtitle: "Etiam porta sem malesuada magna mollis euismod. Nullam quis risus urna mollis ornare vel eu leo."),
                      ExpandingTableViewCellContent(title: "Aenean lacinia bibendum nulla sed consectetur.",
                                                    subtitle: "Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id elit non mi porta gravida at eget metus.")]
    }
}

extension ViewController : UITableViewDataSource, UITableViewDelegate {

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

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView .dequeueReusableCell(withIdentifier: String(describing: ExpandingTableViewCell.self), for: indexPath) as! ExpandingTableViewCell
        cell.set(content: datasource[indexPath.row])
        cell.delegate = self
        cell.indexPath = indexPath
        return cell
    }

    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let content = datasource[indexPath.row]
        content.expanded = !content.expanded
        tableView.reloadRows(at: [indexPath], with: .automatic)
    }
    func closeFriendsTapped(at index: IndexPath) {
        print("button tapped at index:\(index.row)")
    }

}

用同样的方法帮助我:

最佳答案

使用您的基本实现，我在ExpandingTableViewCell中添加了两个用于扩展和折叠高度的静态常量

static let collapsedHeigth : CGFloat = 80
static let expandedHeigth : CGFloat = 210

还在ViewController实现中添加了heightForRowAtIndexPath方法

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
       let currentExpandingContext = datasource[indexPath.row]
        if(currentExpandingContext.expanded)
        {
            return ExpandingTableViewCell.expandedHeigth
        }else
        {
            return ExpandingTableViewCell.collapsedHeigth//fixed heigth
        }
    }

repository中的所有代码

希望这可以帮助

关于ios - 如何制作可展开的表格 View 以显示iOS的其余详细信息？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44614799/