使用 UIStackView 的动态 UITableView 行高?

Dynamic UITableView row height using UIStackView?(使用 UIStackView 的动态 UITableView 行高?)
本文介绍了使用 UIStackView 的动态 UITableView 行高?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

很惊讶这不是开箱即用的,因为这似乎是堆栈视图的一个重要用例.我有一个 UITableViewCell 子类,它将 UIStackView 添加到 contentView.我在 tableView(_cellForRowAtIndexPath:) 中向堆栈视图添加标签,并且 tableview 设置为使用动态行高,但它似乎不起作用,至少在 Xcode 7.3 中.我也觉得在堆栈视图中隐藏排列的子视图是可动画的,但这似乎也被打破了.

Surprised this isn't working out of the box, as this seems to be an important use case for stack views. I have a UITableViewCell subclass which adds a UIStackView to the contentView. I'm adding labels to the stack view in tableView(_cellForRowAtIndexPath:) and the tableview is set to use dynamic row heights, but it doesn't appear to work, at least in Xcode 7.3. I was also under the impression that hiding arranged subviews in a stack view was animatable, but that seems broken as well.

关于如何使其正常工作的任何想法?

Any ideas on how to get this working correctly?

class StackCell : UITableViewCell {
    enum VisualFormat: String {
        case HorizontalStackViewFormat = "H:|[stackView]|"
        case VerticalStackViewFormat = "V:|[stackView(>=44)]|"
    }

    var hasSetupConstraints = false
    lazy var stackView : UIStackView! = {
        let stack = UIStackView()
        stack.axis = .Vertical
        stack.distribution = .FillProportionally
        stack.alignment = .Fill
        stack.spacing = 3.0
        stack.translatesAutoresizingMaskIntoConstraints = false
        return stack
    }()

    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        contentView.addSubview(stackView)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func updateConstraints() {
        if !hasSetupConstraints {
            hasSetupConstraints = true
            let viewsDictionary: [String:AnyObject] = ["stackView" : stackView]
            var newConstraints = [NSLayoutConstraint]()
            newConstraints += self.newConstraints(VisualFormat.HorizontalStackViewFormat.rawValue, viewsDictionary: viewsDictionary)
            newConstraints += self.newConstraints(VisualFormat.VerticalStackViewFormat.rawValue, viewsDictionary: viewsDictionary)
            addConstraints(newConstraints)
        }
        super.updateConstraints()
    }

    private func newConstraints(visualFormat: String, viewsDictionary: [String:AnyObject]) -> [NSLayoutConstraint] {
        return NSLayoutConstraint.constraintsWithVisualFormat(visualFormat, options: [], metrics: nil, views: viewsDictionary)
    }

class ViewController: UITableViewController {

    private let reuseIdentifier = "StackCell"
    private let cellClass = StackCell.self

    override func viewDidLoad() {
        super.viewDidLoad()
        configureTableView(self.tableView)
    }

    private func configureTableView(tableView: UITableView) {
        tableView.registerClass(cellClass, forCellReuseIdentifier: reuseIdentifier)
        tableView.separatorStyle = .SingleLine
        tableView.estimatedRowHeight = 88
        tableView.rowHeight = UITableViewAutomaticDimension
    }

    private func newLabel(title: String) -> UILabel {
        let label = UILabel()
        label.text = title
        return label
    }

    // MARK: - UITableView
    override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        return 4
    }

    override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 44.0
    }

    override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 10
    }

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier(reuseIdentifier, forIndexPath: indexPath) as! StackCell
        cell.stackView.arrangedSubviews.forEach({$0.removeFromSuperview()})
        cell.stackView.addArrangedSubview(newLabel("(indexPath.section)-(indexPath.row)"))
        cell.stackView.addArrangedSubview(newLabel("Second Label"))
        cell.stackView.addArrangedSubview(newLabel("Third Label"))
        cell.stackView.addArrangedSubview(newLabel("Fourth Label"))
        cell.stackView.addArrangedSubview(newLabel("Fifth Label"))
        return cell
    }

    override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        let cell = tableView.cellForRowAtIndexPath(indexPath) as! StackCell
        for (idx, view) in cell.stackView.arrangedSubviews.enumerate() {
            if idx == 0 {
                continue
            }
            view.hidden = !view.hidden
        }
        UIView.animateWithDuration(0.3, animations: {
            cell.contentView.layoutIfNeeded()
            tableView.beginUpdates()
            tableView.endUpdates()

        })
    }
}

推荐答案

似乎需要在 UITableViewCell 的 init 中添加约束并添加到 contentView 而不是单元格的视图.

It seems that for this to work the constraints need to be added in the init of the UITableViewCell and added to the contentView instead of cell's view.

工作代码如下所示:

import UIKit
class StackCell : UITableViewCell {
    enum VisualFormat: String {
        case HorizontalStackViewFormat = "H:|[stackView]|"
        case VerticalStackViewFormat = "V:|[stackView(>=44)]|"
    }

    var hasSetupConstraints = false
    lazy var stackView : UIStackView! = {
        let stack = UIStackView()
        stack.axis = UILayoutConstraintAxis.Vertical
        stack.distribution = .FillProportionally
        stack.alignment = .Fill
        stack.spacing = 3.0
        stack.translatesAutoresizingMaskIntoConstraints = false
        stack.setContentCompressionResistancePriority(UILayoutPriorityRequired, forAxis: .Vertical)
        return stack
    }()

    override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        contentView.addSubview(stackView)
        addStackConstraints()
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func addStackConstraints() {
        let viewsDictionary: [String:AnyObject] = ["stackView" : stackView]
        var newConstraints = [NSLayoutConstraint]()
        newConstraints += self.newConstraints(VisualFormat.HorizontalStackViewFormat.rawValue, viewsDictionary: viewsDictionary)
        newConstraints += self.newConstraints(VisualFormat.VerticalStackViewFormat.rawValue, viewsDictionary: viewsDictionary)
        contentView.addConstraints(newConstraints)
        super.updateConstraints()
    }

    private func newConstraints(visualFormat: String, viewsDictionary: [String:AnyObject]) -> [NSLayoutConstraint] {
        return NSLayoutConstraint.constraintsWithVisualFormat(visualFormat, options: [], metrics: nil, views: viewsDictionary)
    }
}

这篇关于使用 UIStackView 的动态 UITableView 行高?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

Why local notification is not firing for UNCalendarNotificationTrigger(为什么没有为UNCalendarNotificationTrigger触发本地通知)
iOS VoiceOver functionality changes with Bundle Identifier(IOS画外音功能随捆绑包标识符而变化)
tabbar middle tab out of tabbar corner(选项卡栏中间的选项卡角外)
Pushing UIViewController above UITabBar(将UIView控制器推送到UITabBar上方)
How can I sync two flatList scroll position in react native(如何在本机Reaction中同步两个平面列表滚动位置)
Get an event when UIBarButtonItem menu is displayed(显示UIBarButtonItem菜单时获取事件)