2017-10-14 65 views
2

我学习的自动布局锚,并试图实现这种简单的事情编程需要更多关于自动布局锚援助

enter image description here

在这里,我的代码

override func viewWillAppear(_ animated: Bool) { 
    super.viewWillAppear(true) 

    let view1 = UIView() 
    view1.backgroundColor = .brown 
    blueView.addSubview(view1) 

    view1.translatesAutoresizingMaskIntoConstraints = false 
    view1.topAnchor.constraint(equalTo: blueView.topAnchor, constant:10).isActive = true 
    view1.bottomAnchor.constraint(equalTo: blueView.bottomAnchor, constant:10).isActive = true 
    view1.leadingAnchor.constraint(equalTo: blueView.leadingAnchor, constant:10).isActive = true 
    view1.trailingAnchor.constraint(equalTo: blueView.trailingAnchor, constant:10).isActive = true 
    view1.heightAnchor.constraint(equalToConstant: 80).isActive = true 
    view1.widthAnchor.constraint(equalToConstant: 80).isActive = true 
} 

而这就是我得到

enter image description here

什么问题?

+0

请将图像,而不是一个链接。 – shallowThought

+0

你期待什么结果?在没有建立测试项目的情况下,事情看起来对我来说很合适 - 您将前导/尾随和顶部/底部锚点设置为将蓝色锚点向下和向右偏移10分。 *有*冲突:蓝色的宽度/高度是100,似乎你正在试图使棕色的宽度/高度80.但是,这可能意味着布局引擎打破这两个,因为他们冲突的底部/尾随约束。 (为什么我这么说?因为结果。)顺便说一下,你有没有检查控制台是否有任何冲突? – dfd

+0

还有一个项目 - 我只注意到你正在将棕色视图变成蓝色视图的子视图。如果您希望剪裁棕色视图以始终保持蓝色视图的边界,请设置该标志。否则,您可以获得公布的结果。 – dfd

回答

0

试着这样做:

override func viewWillAppear(_ animated: Bool) { 
super.viewWillAppear(true) 

let view1 = UIView() 
view1.backgroundColor = .brown 
view.addSubview(view1) 

view1.translatesAutoresizingMaskIntoConstraints = false 

//Constraints 
let centerXConstraint = view1.centerXAnchor.constraint(equalTo: self.view.centerXAnchor, constant: 0) 
let centerYConstraint = view1.centerYAnchor.constraint(equalTo: self.view.centerYAnchor, constant: 0) 
let widthConstraint = view1.widthAnchor.constraint(equalToConstant: 100) 
let heightConstraint = view1.heightAnchor.constraint(equalToConstant: 100) 

//Apply constraints 
constraintToApply.append(centerXConstraint) 
constraintToApply.append(centerYConstraint) 
constraintToApply.append(widthConstraint) 
constraintToApply.append(heightConstraint) 
} 

,并添加下面的代码:

override func viewDidAppear(_ animated: Bool) { 

    // Apply Constraints 
    NSLayoutConstraint.activate(constraintToApply) 
    self.view.layoutIfNeeded() 
} 

希望这可以帮助你。

+0

请再次查看我的问题我修改了它。 –

1

怎么回事?

我看到三类问题:

  1. 有些约束是不活跃的。 heightAnchorwidthAnchor约束尚未设置,因此isActive = true
  2. 约束有冲突。您基于常量设置约束,而不考虑超视图的尺寸。这导致约束发生冲突,例如,view1不可能是来自底部锚点的顶点的顶点和顶点的263点,而是全部在同一时间。
  3. 基于常量的约束通常无法将视图居中在屏幕上,因为屏幕大小差别很大。

这里是一个可能的解决这三个问题:

override func viewWillAppear(_ animated: Bool) { 
    super.viewWillAppear(true) 

    let view1 = UIView() 
    view1.backgroundColor = .brown 
    view.addSubview(view1) 

    view1.translatesAutoresizingMaskIntoConstraints = false 
    view1.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true 
    view1.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true 
    view1.heightAnchor.constraint(equalToConstant: 100.0).isActive = true 
    view1.widthAnchor.constraint(equalToConstant: 100.0).isActive = true 
} 

在这里,我们已成立的上海华盈的view1等于X和Y中心的X和Y中心,定义的高度和宽度为view1作为常量,并将所有相关约束设置为活动状态。

您可以在Auto Layout Guide中找到其他解决方案。

+0

@Pursuingperfection我相信你添加到顶部/底部/前导/尾随约束的10个点常量是问题的根源。用'view1.topAnchor.constraint(equalTo:blueView.topAnchor).isActive = true'替换'view1.topAnchor.constraint(equalTo:blueView.topAnchor,constant:10).isActive = true',正确地进行。 –

0

您为每个约束添加+10分。

view1.topAnchor.constraint(equalTo: blueView.topAnchor, constant:10).isActive = true 

这意味着“设置视图1的顶部主播蓝景的顶部锚加10”

只是删除constant:10

view1.topAnchor.constraint(equalTo: blueView.topAnchor).isActive = true 

如果你设置上,下,左,领导和尾随的锚,你不应该设置高度和宽度。宽度和高度将根据这4个锚点进行计算。所以,你应该删除

view1.heightAnchor.constraint(equalToConstant: 80).isActive = true 
view1.widthAnchor.constraint(equalToConstant: 80).isActive = true