布局约束不起作用

Posted 2023-03-15

【中文标题】布局约束不起作用

【英文标题】：Layout Constraints are not working

【发布时间】：2016-10-17 14:07:11

【问题描述】：

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

我正在尝试向超级视图添加另一个视图以提供总共两个视图。我希望这个视图能填满剩余的空间。我正在尝试这段代码，

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)

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

【问题讨论】：

您是否有理由不在界面生成器中执行此操作？

WKWebView (webview) 在那里不可用。

【参考方案1】：

您已经很接近了，但缺少一些关键的东西：

在创建自己的约束时，您不想使用自动调整大小的蒙版约束，因此将 webview.translatesAutoresizingMaskIntoConstraints 设置为 false 并且不需要 autoresizingMask 行。

李>

您将宽度设置为等于视图，但未定义任何 x 位置。您还可以约束前缘或水平中心来定义位置。

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

【参考方案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))

【讨论】：

对不起，这是一个非情节提要解决方案：/也许你可以通过编程来完成它；）