【问题标题】:Center stack view elements and not fill them中心堆栈视图元素而不是填充它们
【发布时间】:2019-08-12 22:03:52
【问题描述】:

我使用 UIStackView 作为 UITableView's BackGroundView 属性,因此当获取填充 tableView 的集合时出错时,我可以调用一个函数来显示此堆栈视图,其中包含显示警告消息的视图和重试按钮。

我在一个空的UIViewController 中测试了类似的行为,因此我可以将stackView 及其子元素居中。当我将堆栈视图固定到 superView 的尾随和前导时,该解决方案起作用,将其垂直居中并将其顶部锚点设置为大于或等于 superView 的顶部锚点,类似地,它的底部锚点大于或等于 superView 的底部锚点。我还将对齐设置为中心和分布以填充,一切似乎都正常工作。

以下是部分截图:

我在 UITableView 的扩展中使用了此代码,但只能重现此行为。这段代码有错误吗?

func show(error: Bool, withMessage message : String? = nil, andRetryAction retry: (() -> Void)? = nil){
    if error{
        let iconLabel = UILabel()
        iconLabel.GMDIcon = .gmdErrorOutline
        iconLabel.textAlignment = .center
        iconLabel.numberOfLines = 0
        iconLabel.font = iconLabel.font.withSize(50)
        iconLabel.textColor = Constants.Colors.ErrorColor

        iconLabel.backgroundColor = .blue

        let messageLabel = UILabel()
        messageLabel.text = message ?? "Ocorreu um erro"
        messageLabel.textColor = Constants.Colors.ErrorColor
        messageLabel.numberOfLines = 0
        messageLabel.textAlignment = .center
        messageLabel.font = UIFont(name: "TrebuchetMS", size: 20)

        messageLabel.backgroundColor = .green

        var views: [UIView] = [iconLabel, messageLabel]

        if let retry = retry{
            let button = RaisedButton(title: "Tentar novamente")
            button.pulseColor = Constants.Colors.PrimaryTextColor
            button.backgroundColor = Constants.Colors.PrimaryColor
            button.titleColor = .white
            button.actionHandle(controlEvents: .touchUpInside, ForAction: retry)
            button.contentEdgeInsets = UIEdgeInsetsMake(10,10,10,10)


            views.append(button)
        }


    }else{
        self.backgroundView = nil
    }
}
let stack = UIStackView()
    stack.spacing = 10
    stack.axis = .vertical
    stack.alignment = .center
    stack.distribution = .fill
    stack.translatesAutoresizingMaskIntoConstraints = false


    for view in views{
        view.translatesAutoresizingMaskIntoConstraints = false
        stack.addArrangedSubview(view)
    }

    if self.tableFooterView == nil{
        tableFooterView = UIView()
    }
    self.backgroundView = stack;

    if #available(iOS 11, *) {
        let guide = self.safeAreaLayoutGuide

        stack.topAnchor.constraint(greaterThanOrEqualTo: guide.topAnchor).isActive = true
        stack.bottomAnchor.constraint(greaterThanOrEqualTo: guide.bottomAnchor).isActive = true
        stack.leadingAnchor.constraint(equalTo: guide.leadingAnchor).isActive = true
        stack.trailingAnchor.constraint(equalTo: guide.trailingAnchor).isActive = true
        stack.centerYAnchor.constraint(equalTo: guide.centerYAnchor).isActive = true
    } else {
        stack.topAnchor.constraint(greaterThanOrEqualTo: self.topAnchor).isActive = true
        stack.bottomAnchor.constraint(greaterThanOrEqualTo: self.bottomAnchor).isActive = true
        stack.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
        stack.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true
        stack.centerYAnchor.constraint(equalTo: self.centerYAnchor).isActive = true
    }

【问题讨论】:

    标签: ios swift iphone uitableview uistackview


    【解决方案1】:

    如果堆栈视图的元素都具有固有大小(即,它们各自高度的总和 + 项目间的间距),则堆栈视图知道它的高度。在这种情况下,因为您有 2 y 位置约束,所以您暗示了一个高度,因此您的约束是不可满足的。您需要的唯一 y 轴约束是垂直居中。摆脱顶部和底部的约束。然后系统将使用固有大小来计算堆栈视图的高度并将其垂直居中于背景视图中。保持 x 轴约束不变。

    【讨论】:

      猜你喜欢
      • 2016-09-09
      • 1970-01-01
      • 2014-02-23
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-05-13
      • 2021-01-26
      • 2021-03-07
      相关资源
      最近更新 更多