2015-05-09 171 views
1

说我有三个UILabels,其位置如下图所示:IOS自动版式动态的UILabel高度

[Label1] [Label2]

[Label3]

Label1Label2是在同一行和Label3低于他们。所有的标签都有固定的宽度,并且会包含动态文本,因此它们的高度会有所不同。

如何使用AutoLayout将Label3的高度降低到高于标签的10点?

例如,如果Label1的高度是100点,Label2的高度是120点(它们的Y位置是相同的),那么Label3应在10分以下Label2,但如果Label1是120点高及Label2是100点高,那么Label3应低于Label1 10点。

+0

像甲约束“对象A应该是对象B低于N个点”是在自动布局极其简单。你能展示一些你先试过的代码吗? –

+0

是的,但我希望对象A是低于具有更高高度的那个N点,比如说对象B和对象C在同一行中,但它们的高度不固定(像一些动态文本),我想要对象A在比较高的对象下面N个点。 –

+0

你可以把Label1和Label2放在一个NSView中,它会随着标签一起变大吗?然后,但在NSView下的Label3? –

回答

7

您只需在两个Label3-> Label1和Label3-> Label2之间进行约束。使用不等式约束。只有一种方法可以满足两者!

您还需要一个用于Label3的顶部约束;其constant应该非常小,其priority应该非常低。这会给两个不平等约束提供一些“针对性”的东西。

这里是一个例子。这完全没有代码实现 - 当然,按钮有向代码中添加文本的代码,但是这些约束完全是在Interface Builder中配置的;标签正在调整大小,底部标签正在向下移动,自动。 (您可以在代码构造相同的布局,如果你想,自然。)

enter image description here

+1

这不是完整的答案,因为在这种情况下,底部'label3'仍然需要Y约束。我的意思是设置两个不等式约束不能唯一标识'label3'的框架 – Azat

+0

@Azat你是对的,我解决了这个问题。 – matt

+0

还添加了一个截屏视频,演示它的工作原理。 – matt

1

我建议你换前两名label s到UIView和设置的限制等等这些label小号适合该view内的所有空间。然后你简单地将vertical spacing constraint添加到底部label3constant = 10。在这种情况下顶部view将有更大的尺寸label并将满足您的条件

0

我认为这将是一个有趣的练习,所以我创建一个小测试项目。代码的要点如下。您可以将其复制/粘贴到标准的Single View iOS模板中。

(请注意,我用SnapKit对程序自动布局,因为它是如此之比的UIKit API简单得多。我觉得它甚至比在Xcode做的事情要简单得多。)

结果是完全一样的马特伟大的截屏。

// ViewController.swift 

import UIKit 
import SnapKit 

class ViewController: UIViewController 
{ 
    override func viewDidLoad() { 
     super.viewDidLoad() 

     let leftLabel = UILabel() 
     leftLabel.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "addText:")) 
     leftLabel.userInteractionEnabled = true 
     view.addSubview(leftLabel) 
     leftLabel.numberOfLines = 0 
     leftLabel.text = "All the world's a stage, and all the men and women merely players: they have their exits and their entrances; and one man in his time plays many parts, his acts being seven ages." 
     leftLabel.snp_makeConstraints { (make) -> Void in 
      make.top.equalTo(40) 
      make.left.equalTo(self.view) 
      make.right.equalTo(self.view.snp_centerX) 
     } 

     let rightLabel = UILabel() 
     rightLabel.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "addText:")) 
     rightLabel.userInteractionEnabled = true 
     view.addSubview(rightLabel) 
     rightLabel.numberOfLines = 0 
     rightLabel.text = "There is a tide in the affairs of men, Which taken at the flood, leads on to fortune. Omitted, all the voyage of their life is bound in shallows and in miseries. On such a full sea are we now afloat. And we must take the current when it serves, or lose our ventures." 
     rightLabel.snp_makeConstraints { (make) -> Void in 
      make.top.equalTo(40) 
      make.right.equalTo(self.view) 
      make.left.equalTo(self.view.snp_centerX) 
     } 

     let bottomView = UIView() 
     view.addSubview(bottomView) 
     bottomView.backgroundColor = UIColor.redColor() 
     bottomView.snp_makeConstraints { (make) -> Void in 
      make.height.equalTo(20) 
      make.left.right.equalTo(self.view) 
      make.top.greaterThanOrEqualTo(leftLabel.snp_bottom) 
      make.top.greaterThanOrEqualTo(rightLabel.snp_bottom) 
     } 
    } 

    @objc func addText(recognizer: UIGestureRecognizer) { 
     if let label = recognizer.view as? UILabel { 
      label.text = label.text! + " I like cheese." 
     } 
    } 
} 

更新了代码以在点击时向标签添加一些额外的文本。

+0

我不这么认为。添加我的按钮的功能(依次向每个标签添加文本)并查看您的'bottomView'是否继续正常服从。 – matt

+0

Works fine @matt ...查看我更新的示例,当您点击它们时将标签添加到标签。好奇你为什么认为它不会? –

+0

因为在我看来有一个缺失的限制。然而,这可能是我错了 - 有时Interface Builder对这些东西是错误的,你可以在代码中做Interface Builder不允许你做的事情。 – matt

0

首先移除高度约束并设置所有3个标签垂直内容压缩性优先1000。这是最重要的部分。

然后将Label3的垂直空间添加到Label1,并设置而不是Equal,Greater Than或Equal,优先级为500.将相同的空间约束添加到Label2。

最后附加约束从LABEL3顶部= 0,但设置优先级为1。