2014-02-19 90 views
3

我有2個UILabels豎直堆疊:如何中心2個垂直堆疊UILabels垂直

+----------------------------+ 
| +----------------------+ | 
| | blah blah blah  | | 
| +----------------------+ | 
|       | 
| +----------------------+ | 
| | asdf fdsa   | | 
| | asdfear aoeirhaleir | | 
| +----------------------+ | 
+----------------------------+ 

的UIViews已經它們的文本在運行時動態加載的,所以它們可以由1至3行中的文本的任何地方有。我想要在文本加載後垂直對齊兩者。它們應該沿着它們的「質量中心」垂直居中。

我該如何做到這一點?

編輯:就像這樣: enter image description here

+0

你是什麼意思,沿着它們的質心垂直居中?從圖中看起來,您希望將頂部標籤錨定在離頂部和底部一定距離的位置,並且距離底部一定距離? – Dima

+0

對不起,這個圖並不是ASCII藝術。我會制定一個模擬並更新這個問題。 –

回答

4

將兩個標籤放在容器UIView中。將標籤邊緣限制到容器的邊緣(除了頂部標籤的底部和底部標籤的頂部,這些邊緣應該相互約束),然後將容器垂直居中放置在頂層視圖中。

您的視圖層次應該是這樣的:

UIView rootView 
    UIView containerView 
    UILabel topLabel 
    UILabel bottomLabel 

有以下限制:

|[topLabel]| 
|[bottomLabel]| 
V:|[topLabel][bottomLabel]| 
|-[containerView]-| 
[NSLayoutConstraint constraintWithFirstItem:containerView firstAttribute:NSLayoutConstraintAttributeCenterY relation:NSLayoutRelationEquals secondItem:rootView secondAttribute:NSLayoutConstraintAttributeCenterY multiplier:1 constant:0] 

(你可以指定所有的IB這些約束而不是代碼,它只是很難形容IB限制在一個StackOverflow帖子中。)

更新:在更新版本的iOS中,它更容易將標籤放在垂直堆棧視圖中,而不是使用普通視圖並手動設置其內部的約束,但技術是相同的。

0

使用自動佈局 - 通過手動NSLayoutContraint的,視覺格式語言(VFL),甚至可以通過Xcode中/ IB - 創建保持標籤的寬度相等的限制,他們的X中心等於超視圖的X中心,高度可變或根據您的需求有所相關。蘋果的Auto Layout Guide

1

你可以用IB來做到這一點。根據內容使其高度靈活。使它們之間的距離較小並且固定。然後在上面和下面放置一個間隔視圖,頂部的頂部約束到超級視圖,底部約束綁定到頂部文本視圖。底部間隔符應該有一個與底部文本視圖相關的頂部約束和一個與超級視圖相關的底部約束,所有的空間都爲零。

最後,製作一個高度限制,使得2個spacer視圖的高度相等。