如何使用autolayout縮放所有屏幕尺寸的視圖？

Question

我的應用程序的主導航視圖使用UIButtons和背景圖像。 我在IB中使用autolayout來布局視圖。

我希望iphone 4,5,6和6plus上的視圖看起來相同（或類似，只是適當縮放）。 我嘗試過使用縱向和橫向約束，但卻無法弄清楚如何使用縱橫比約束。

這就是iphone 5上的視圖。

這是我到目前為止在iphone 6上得到的

這就是我想在iphone 6 / 6plus上看起來的樣子。

如何使用autolayout縮放視圖，使其在所有iphone屏幕尺寸上看起來相同或相似？

Answer 1

我做了一些修補，我相信我找到了解決方案。 我將演示如何在視圖中間大致為兩個較大的正方形做這個。

這是一個參考圖像：

首先，您需要創建一個橫跨超視圖整個寬度的容器（我的藍色視圖），其高度與內部正方形（橙色）相同或更大。
此視圖需要以下約束：將中心X與Superview對齊，將中心Y與Superview對齊（ OR約束以使其為您想要的Y位置），高度等於：[方形高度]，尾隨空間到超級視圖，前導空間到超級視圖。

內橙色正方形必須放在容器內，並且必須給出以下約束：將中心X與超視圖對齊，將前導空間與超視圖對齊（值=正方形與超視圖邊緣之間的空間）， 尾隨空格到[其他視圖]（值=正方形之間的空間）。 選擇兩個方塊，並添加“寬高比”，“等寬”和“等高”約束。
粗體項取決於您選擇的方格。 左邊的應該有超前視圖的前導空格和其他視圖的尾隨空間，右邊的應該交換這些約束。

這可以通過自動布局為您提供所需的效果。

Answer 2

派對有點晚，但我猜這將有助於將來的某個人。 這是我認為更好的方法。 我將編寫我遵循的步驟以達到預期的結果。

1 - 在視圖控制器中添加兩個方塊，如下所示。

2 - 現在選擇第一個立方體，然后從屏幕底部選擇Pin菜單。 添加頂部和左側約束。

3 - 現在選擇第二個立方體，右邊的立方體，並從Pin菜單中添加右邊和上邊的約束。

4 - 現在選擇第一個立方體，然后從立方體內部cntrl-拖動到視圖控制器。 現在從菜單中選擇“Equal Widths”。 困惑吧？ 堅持，稍等。

5 - 現在雙擊“Equal Widths”約束線，彈出一個菜單。 在“乘數”字段中，將值更改為0.4

6 - 對右側立方體重復步驟4和5。

7 - 這就是不同尺寸iPhone的結果。 （第一個是4英寸設備，第二個是4.7英寸設備，第三個是3.5英寸設備）。 PS：底部被裁剪，因為截圖來自預覽:)

更新（16/01/2018）

在步驟4中，選擇'Equals Width'，選擇'Aspect Ratio'。 在此之后省略步驟5。