单击时调整 tableView 全屏的大小

Question

我正在做以下工作： Screenshot

基本上它是一个 UIImageView 在另一个 UIImageView 的顶部（屏幕的 60%）和一个 UITableView 占据屏幕的 40%

和代码（见下文）：

我想要实现的是在单击我的 customCell 时调整 UITableView 全屏单元格的大小，并在未单击时将其大小调整为原始状态。

有什么办法可以使这个工作吗？ 提前致谢。

    //Label outlets

@IBOutlet weak var tableView: UITableView!


var selectedIndexPath : IndexPath? = nil


override func viewDidLoad() {
    super.viewDidLoad()

//MARK Start of CustomViewCell Code

    tableView.register(UINib(nibName: "CustomViewCell", bundle: nil), forCellReuseIdentifier: "Cell")

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

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "Cell") as! CustomViewCell

    cell.clipsToBounds = true

    return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {

    let index = indexPath

    if selectedIndexPath != nil {
        if index == selectedIndexPath {
            return 667
        } else {
            return 62
        }

    } else {

        return 62}
}

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {

    switch selectedIndexPath {
    case nil:
        selectedIndexPath = indexPath
    default:
        if selectedIndexPath! == indexPath {
            selectedIndexPath = nil
        } else {
            selectedIndexPath = indexPath
        }
    }

    tableView.reloadRows(at: [indexPath], with: .automatic)

}

    //MARK End of CustomViewCell Code

Answer 1

除了重新加载具有新高度的单元格之外，您还需要更改表格视图的框架。如果你想让表格占据整个屏幕，请确保为它创建一个 IBOutlet，比如 myTableView，然后：

tableView.reloadRows(at: [indexPath], with: .automatic)

添加此代码：

myTableView.frame = view.bounds

您还可以创建一个 Bool 变量来跟踪表格视图的正常和全屏模式，以及一些 CGRect 变量来保持初始帧。当您希望表格视图返回其初始帧时，您可能需要这样的东西：

myTableView.frame = initialTableViewFrame

希望你能明白。

Answer 2

这是一种纯粹的自动布局方法：

1.在您的界面构建器中，创建一个UIImageView 并带有约束 [Trailing, Leading, Top , Bottom, Height]，使高度 >= 并且优先级为 999。稍后您将在代码中使用此高度进行展开/折叠逻辑。

2.创建一个虚拟 UIView，其高度将在稍后以编程方式设置，当您为 imageview 创建扩展效果时，此 UIView 将“推动”/“拉伸”您的单元格高度。将其可见性设置为隐藏，因为您不需要向用户显示它。

3.在您的自定义单元格中，创建两个NSLayoutConstraint 实例作为@IBoutlets，一个用于 UIImageView 高度，一个用于虚拟 UIView 高度，然后稍后在您的界面文件中连接它们。

let lowPriorityHeight : Float = 250;
let highPriorityHeight : Float = 999;
class CustomCell: UITableViewCell {
    @IBOutlet weak var imgVwHeight: NSLayoutConstraint!
    @IBOutlet weak var tempHeight : NSLayoutConstraint!
    var isExpanded = false{
        didSet{
            imgVwHeight.priority = (isExpanded) ? lowPriorityHeight : highPriorityHeight;
            if isExpanded == true{
                tempHeight.constant = ExpandedHeight
            }else{
                tempHeight.constant = NormalHeight
            }
        }
    }

4.在您的主类中，将isExpanded 设置为true 或false 以创建效果。

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let cell = tableView.cellForRow(at: indexPath) as! CustomCell
        cell.isExpanded = !cell.isExpanded
        tableView.reloadData()
    }
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell : CustomCell = tableView.dequeueReusableCell(withIdentifier: "kCustomCell", for: indexPath) as! CustomCell
        return cell
    }

你可以下载我的示例实现HERE