Autolayout：原點和大小應根據寬度和高度因子而變化

Question

這是我需要的場景。

我把IB上的UIButton（大小為iPhone4英寸）放在IB上的初始幀為x：100，y：100，w：100，h：100 。 我希望起源和高度應根據設備大小而變化。 例如，iPhone6的寬度和高度為375X667，因此寬度系數（375/320 = 1.1718）和高度系數（667/568 = 1.1742） 。 在這個場景中，我想用乘以寬度因子（1.1718）和原點Y和高度乘以高度因子（1.1782）來改變我的按鈕原點X和寬度。 在這種情況下，我的按鈕應顯示在x：100X1.1718，y：100X1.1742，w：100X1.1718，h：100X1.1742 。

iPhone6 +需要同樣的東西。

我可以通過設置此自動調整蒙版輕松實現此目的。 如何使用autolayout實現相同目的？ 我應該遵循什么步驟，我應該應用哪些約束？

我之前的問題

我通過使用Autolayout附加了一些我需要的截圖（實現了上圖中顯示的自動調整掩碼）。

我的嘗試： -

步驟1： - 在IB上按一個尺寸為100X100的按鈕。 設置其X = 100和y = 100。 第2步： - 應用此約束。

Answer 1

根據您的問題，您可以將此約束設置為您的UIButton。

---

您不需要更改為UIButton的高度和寬度設置的約束。

---

1.）您需要為Button.Leading和Superview.Trailing設置水平空間。

設置常數= 0 ， 優先級= 1000和乘數= 100：320，因為我已在下面的圖像中設置。

---

2.）您需要為Button.Top和Superview.Bottom設置水平空間。

設置常數= 0 ， 優先級= 1000和乘數= 100：568，因為我在下面的圖像中設置了。

---

結果

---

希望這能解決你的問題。

Answer 2

使用約束的乘數。 因此，設置一個約束，即按鈕的寬度等於頂視圖的寬度，乘數為100：320（您可以使用此比率形式來表示乘數）。 將約束的常量設置為0.對於按鈕的高度與頂視圖的高度成比例（對於比率100：568），請執行相同的操作。 對於按鈕的位置，將按鈕的寬度限制為100：320，按鈕頂部到頂視圖的高度，比例為100：568。

Answer 3

如果要在故事板（或XIB）中完全執行此操作，則需要使用間隔視圖。

首先，在根視圖的左上角放置一個間隔視圖。 將其上邊緣和左邊緣限制為距離超視圖的距離為零。 將其寬度限制為100：320到其超視寬度（並確保約束的第一項是間隔）。 將其高度限制為100：568至其超視高度。 這些寬度和高度約束將控制按鈕的位置。

現在將按鈕的上邊緣約束到墊片的下邊緣，並將按鈕的左邊緣約束到墊片的右邊緣。 在按鈕和超視圖之間創建比例寬度和高度約束。

將間隔視圖設置為隱藏。 隱藏的視圖不可見，不接觸，但仍然參與布局。

...如果您想在代碼中執行此操作，只需使用自動調整掩碼並將translatesAutoresizingMaskIntoConstraints設置為YES 。

Answer 4

對於高度和寬度，在Interface Builder中創建“寬高比”約束，將按鈕鏈接到超級視圖。 寬高比沒有屬性; 它將使用創建時的值來設置乘數（如果iPhone <= 5寬度並將superview鏈接到按鈕寬度，則為320：100）。 為縱橫比添加第二個約束，將按鈕高度鏈接到超視圖高度（如果您不希望使用iPhone 5拉伸高度，則可以將按鈕縱橫比鏈接到自身。）。

對於原點，我認為沒有辦法將觀點的來源和觀點的大小聯系起來。 要根據屏幕大小將原點設置為任意高度或寬度，您需要創建間隔視圖。 不雅，但必要。 添加視圖並將其設置為隱藏（並將其命名為左側的對象輪廓，在IB中使用autolayout時，您可能希望對所有內容進行操作以使約束可讀，但絕對可以在此處輕松找到它） 。 將創建約束設置為零將其鏈接到按鈕和頂部布局指南，並將零設置為superview.leading和按鈕前導。

要調整間距，您可以為超視圖寬度和超視圖高度創建寬高比約束，或者只是將其設置為等於按鈕寬度和高度。

Answer 5

試試這個解決方案

1. 將視圖頂部對齊設置為superviews centerY並將乘數設置為84：240
2. 將視圖左對齊設置為超視圖中心X並將乘數設置為100：160
3. 用乘數100：320和比例高度100：568設定比例寬度

希望這能解決你的問題

Answer 6

您可以使用2個輔助視圖在IB中完成所有操作。 Top helper和Left Helper 。 其余的只是設置它，以便每個高度和寬度適當地與視圖的大小成比例。 我舉了一個例子。 這里有幾個截圖和不同的視圖大小。