2014-10-17 58 views
7

我是新來的自動佈局,我很困擾如何將這4個圖像集中在所有不同的設備,如它看起來在圖像上。我試圖應用自動配置的約束,但它會有這樣的距離,並不適合所有設備。所以我的問題是我需要在所有不同的圖像上應用哪些約束條件才能使所有圖像以相同的距離居中?中心4圖像與約束自動佈局

這是我在故事板細胞的樣子:的約束選項

enter image description here

圖像的圖像1:

enter image description here

在模擬圖像:

enter image description here

/// MY TRY ////

在這裏您可以看到我添加的約束和結果?

enter image description here

結果:

enter image description here

+1

一個建議就是爲您的圖像視圖創建一個容器視圖。然後在視圖控制器視圖中將該容器視圖居中。 – mustafa 2014-10-17 19:39:19

回答

6

您的方法幾乎是正確的,它只是缺乏大小對圖像的約束。

如果要動態調整圖像大小並保持它們之間的空間不變,請將寬度爲>=20(或任何其他值,取決於您的需要)的圖像約束和用於保持寬高比。然後按住Ctrl鍵並從UIImageView1拖動到UIImageView2,並設置等寬的限制。重複從UIImageView1UIImageView3和從UIImageView1UIImageView4

enter image description here


如果您希望圖像始終保持其固定的大小和它們之間動態調整的空間,你需要另一種方法:

這裏的竅門是將UIImageViews的之間的3個空UIViews這樣它看起來像這樣:

enter image description here

  • 設置約束頂端所有視圖
  • 集約束到左和右爲UIImageView1和4個
  • 所有的UIImageViews集約束爲相同的寬度
  • 用於向相同的的UIImageViews之間的所有UIViews集約束寬度
  • 用於所有視圖之間的距離設置的限制爲0
  • 設置爲UIViews寬度約束>= 0

這種方式會使UIImageViews之間的空UIViews動態調整大小並調整所有寬度。

我希望你明白。

+0

嘿,謝謝你的時間。我可以看到你已經做了一個演示項目。爲了顯示目的。我一直在掙扎,它似乎還沒有結果。你能跟我分享這個項目嗎?預先感謝您 – 2014-10-17 20:36:26

+0

我編輯了我的答案,請檢查是否解決了您的問題。 – zisoft 2014-10-18 14:22:09

+0

謝謝,我現在就來看看吧! 最好的問候 – 2014-10-18 17:39:33

0

對於第一圖像加上一個前導空格至上海華和最後的圖像添加一個尾隨空間上海華和添加第一和第二之間的垂直間距,第二和第三,第三和第四,也設置容器內的水平中心到每個圖像

+0

我已經試過正是你所說的。在底部看我的問題。 – 2014-10-17 20:17:35

0

故事板上的對象需要每個對象至少有4個約束

當UIImageView對象周圍有橙色線條出現在您的問題中時,這意味着約束丟失或衝突,並且通常意味着圖像在運行時不會像您期望的那樣顯示。

在第一種情況下,我建議您選擇所有對象和'清除約束',然後重新開始。

雖然不完全一樣,但下面是一個答案的鏈接,它更詳細地解釋了自動佈局約束。一旦你瞭解它,自動佈局可以非常強大。

>>Link to similar auto-layout issue - iOS CustomTableViewCell: elements not aligning correctly<<

我希望這有助於

0

如果您希望圖像始終保持其固定的大小和它們之間動態調整的空間,然後第一個非常簡單的方法你拖四的UIView在你的故事板 集約束爲所有UIViews左上角和右下角,並給所有UIViews賦予相同的寬度(從一個UIView拖到另一個UIView並設置其等寬度爲所有UIViews重複這個工作)。

Image about layouts

其次,你必須在這些UIViews拖動設置你的圖片,並將其約束高度寬度和中心水平在容器中心垂直於容器中。

在上次設置的所有UIViews默認(白色)的背景顏色,你會得到它的結果它將工作....我保證。

Screenshot of Xcode