Question

我在故事板中添加了一个UIButton，底部，左侧和右侧设置为superview的;并且高度设置为硬编码60：它是超视图的宽度，位于底部。

我正在尝试向superview添加另一个视图，以提供总共两个视图。我希望这个视图填补空间的其余部分。我正在尝试这段代码，

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

    webview = WKWebView()
    webview.backgroundColor = .blue
    webview.translatesAutoresizingMaskIntoConstraints = true
    webview.autoresizingMask = [.flexibleWidth, .flexibleHeight, .flexibleTopMargin, .flexibleBottomMargin]
    view.addSubview(webview)

    var constraints: [NSLayoutConstraint] = ([.top, .width] as [NSLayoutAttribute]).map {
        NSLayoutConstraint(item: webview, attribute: $0, relatedBy: .equal, toItem: view, attribute: $0, multiplier: 1, constant: 0)
    };
    constraints.append(NSLayoutConstraint(item: webview, attribute: .bottom, relatedBy: .equal, toItem: connectionButton, attribute: .top, multiplier: 1, constant: 0))

    view.addConstraints(constraints)
    NSLayoutConstraint.activate(constraints)
}

然而，效果是按钮占据了整个屏幕，我根本看不到新视图。我做错了什么？

Answer 1

你很亲密，但遗漏了几件关键的事情：

创建自己的约束时，您不希望使用自动调整大小遮罩约束，因此请将webview.translatesAutoresizingMaskIntoConstraints设置为false，并且不需要autoresizingMask行。
您将宽度设置为等于视图，但未定义任何x位置。您还可以约束前缘或水平中心以定义位置。

我认为这将解决您的问题。

Answer 2

如果我理解正确，这样的事情可行。你的webView占据了除了底部60之外的所有空间。左边和右边的两个按钮位于底部60.左边有20个边距，60个宽边和10个间距。

webView.translatesAutoresizingMaskIntoConstraints = false
buttonLeft.translatesAutoresizingMaskIntoConstraints = false
buttonRight.translatesAutoresizingMaskIntoConstraints = false

addSubview(webView)
addSubview(buttonLeft)
addSubview(buttonRight)

// setup your views

let viewsDict = [
  "web"  : webView,
  "btnL" : buttonLeft,
  "btnR" : buttonRight
]

addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[web]-60-|", options: [], metrics: nil, views: viewsDict))
addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[web]|", options: [], metrics: nil, views: viewsDict))

addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|2000@1-[btnL(60)]|", options: [], metrics: nil, views: viewsDict))
addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|2000@1-[btnR(60)]|", options: [], metrics: nil, views: viewsDict))
addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|-20-[btnL(60]-10-[btnR(60)]-2000@1|", options: [], metrics: nil, views: viewsDict))

布局约束不起作用

2 个答案: