展开UITableView以在Stack View中显示所有单元格?

And*_*e M 9 uitableview ios swift uistackview

我无法让我的UITableView在我的堆栈视图中显示为全高.

我的视图树看起来如下:

- View
  - Scroll View
    - Stack View
      - Table View
      - Image View
      - Map View
Run Code Online (Sandbox Code Playgroud)

表视图使用数据动态填充,工作正常.问题是一次只能看到一行,我必须滚动列表.我希望看到的是桌面视图需要尽可能多的垂直空间来显示所有单元格.

我确实尝试调整表高度,如下所示,但最终只有不再滚动的表,但即使它确实有效,我宁愿有更动态的东西:

override func viewDidAppear(animated: Bool) {
    super.viewDidAppear(animated)        
    self.detailsTableView.frame.size.height = 200
}
Run Code Online (Sandbox Code Playgroud)

我怀疑它可能是"堆栈视图"的一个方面需要调整,但我现在还不确定.有谁能建议一个合适的方式?

Mar*_*ria 34

我遇到了同样的问题,意识到你需要一个自我调整表视图.我偶然发现了这个答案并创建了一个像@MuHAOS建议的子类.我没有遇到任何问题.

class IntrinsicTableView: UITableView {

    override var contentSize:CGSize {
        didSet {
            self.invalidateIntrinsicContentSize()
        }
    }


    override var intrinsicContentSize: CGSize {
        self.layoutIfNeeded()
        return CGSize(width: UIViewNoIntrinsicMetric, height: contentSize.height)
    }

}
Run Code Online (Sandbox Code Playgroud)

  • 这应该是公认的答案。谢谢你@玛丽亚 (2认同)
  • 有人可以解释一下答案吗? (2认同)

ske*_*ech 7

UIStackView 将尽可能地压缩视图,以抵消这种设置 UITableView 的高度锚点和宽度锚点或其高度和宽度的优先级。这是一个工作示例,说明我们如何在堆栈视图中管理表的维度。

实例化和集中定位 UIStackView 的扩展

首先,我编写了一个 UIStackView 扩展,这样我就不需要在视图控制器中包含所有代码。您的定位和设置会有所不同,因为您将堆栈视图放置在滚动视图中,但将这些代码分开意味着您可以进行自己的调整。

extension UIStackView {
    
    convenience init(axis:UILayoutConstraintAxis, spacing:CGFloat) {
        self.init()
        self.axis = axis
        self.spacing = spacing
        self.translatesAutoresizingMaskIntoConstraints = false
    }
    
    func anchorStackView(toView view:UIView, anchorX:NSLayoutXAxisAnchor, equalAnchorX:NSLayoutXAxisAnchor, anchorY:NSLayoutYAxisAnchor, equalAnchorY:NSLayoutYAxisAnchor) {
        view.addSubview(self)
        anchorX.constraintEqualToAnchor(equalAnchorX).active = true
        anchorY.constraintEqualToAnchor(equalAnchorY).active = true
        
    }
    
}
Run Code Online (Sandbox Code Playgroud)

我们不只为 UIStackView 设置一个位置的大小,而是其中包含的内容决定了它的大小。还要注意translatesAutoresizingMaskIntoConstraintsUIStackView 扩展中对 false的设置。(我们只需要为堆栈视图设置这个属性,它的子视图简单地继承了行为。)

带有数据源代码的 UITableView 类

接下来,我创建了一个用于演示目的的基本表类。

class MyTable: UITableView, UITableViewDataSource {
    let data = ["January","February","March","April","May","June","July","August","September","October","November","December"]
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return data.count
    }
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("SauceCell", forIndexPath: indexPath)
        cell.textLabel?.text = data[indexPath.row]
        return cell
    }
}
Run Code Online (Sandbox Code Playgroud)

在视图控制器中设置堆栈视图和表

最后,重要的东西。一旦我们将我们的表添加到堆栈视图中,所有帧信息都将被忽略。所以我们需要最后两行代码,按照Auto Layout可以理解的方式设置表格的宽高。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        let table = MyTable(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height))
        table.registerClass(UITableViewCell.self, forCellReuseIdentifier: "SauceCell")
        table.dataSource = table

      
        let stack = UIStackView(axis: .Vertical, spacing: 10)
        stack.anchorStackView(toView: view, anchorX: stack.centerXAnchor, equalAnchorX: view.centerXAnchor, anchorY: stack.centerYAnchor, equalAnchorY: view.centerYAnchor)
        
        stack.addArrangedSubview(table)

        
        table.widthAnchor.constraintEqualToAnchor(view.widthAnchor, multiplier: 1).active = true
        table.heightAnchor.constraintEqualToAnchor(view.heightAnchor, multiplier: 0.5).active = true
        
    }
    
    
}
Run Code Online (Sandbox Code Playgroud)

请注意,我们在向堆栈视图添加视图时使用addArrangedSubview: not addSubview:

(我写过关于 UIStackView 的博文以及其他关于Auto Layout 的文章,它们可能也有帮助。)