2015-05-09 165 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。