ios - 使用编程约束在 View 中创建 2 个 View

Question

我正在尝试向 CallOutView 添加 2 个 View 。 pushButton 应该位于底部，静态高度为 20。然后 topView 应该填充其余部分。我尝试使用 SnapKit 以编程方式执行此操作.然而，似乎按钮只是填满了一切？我做错了什么？

       callOutView = UIView(frame: CGRectMake(-70+(self.frame.width/2), -65, 140, 60))
        callOutView!.backgroundColor = UIColor.clearColor()
        callOutView?.clipsToBounds = true
        callOutView?.layer.cornerRadius = 6
        self.addSubview(callOutView!)

        let topView = UIView()
        topView.backgroundColor = UIColor.whiteColor().colorWithAlphaComponent(0.8)
        callOutView?.addSubview(topView)


        let pushButton = UIButton()
        pushButton.backgroundColor = UIColor(rgba: "#09316e").colorWithAlphaComponent(0.8)
        pushButton.setTitle("Se Mere", forState: UIControlState.Normal)
        pushButton.setTitleColor(UIColor.whiteColor(), forState: UIControlState.Normal)
        pushButton.titleLabel?.font = UIFont.systemFontOfSize(8)
        callOutView?.addSubview(pushButton)

        topView.snp_makeConstraints { (make) -> Void in
            make.top.equalTo(callOutView!).offset(0)
            make.left.equalTo(callOutView!).offset(0)
            make.bottom.equalTo(pushButton).offset(0)
            make.right.equalTo(callOutView!).offset(0)
            make.height.equalTo(40)

        }

        pushButton.snp_makeConstraints { (make) -> Void in
            make.height.equalTo(20)
            make.top.equalTo(topView).offset(0)
            make.left.equalTo(callOutView!).offset(0)
            make.bottom.equalTo(0).offset(0)
            make.right.equalTo(callOutView!).offset(0)

        }

Answer 1

问题是有些约束相互冲突，这会使自动布局系统破坏其中的一些约束。

topView.snp_makeConstraints { (make) -> Void in
    ...
    make.bottom.equalTo(pushButton).offset(0)
    ...
}


pushButton.snp_makeConstraints { (make) -> Void in
    ...
    make.top.equalTo(topView).offset(0)
    ...
}

上面的两个约束告诉自动布局系统:

1. 放置 topView 和 pushButton 并使上边缘对齐。
2. 放置 topView 和 pushButton，底部边缘对齐。

如果您给 topView 和 pushButton 不同的高度，这是不可能的。

此外，这显然不是您想要的。您想要的是“将pushButton 放在topView 的正下方”。

下面是使 pushButton 位于 topView 正下方的修改代码:

topView.snp_makeConstraints { (make) -> Void in
    ...
    make.bottom.equalTo(pushButton.snp_top).offset(0)
    ...
}


pushButton.snp_makeConstraints { (make) -> Void in
    ...
    make.top.equalTo(topView.snp_bottom).offset(0)
    ...
}