如何使用Autolayout實現按屏幕顯示結果

Question

夥計們，我正在爲我的客戶開發一個約會應用，我面臨的問題是隻能爲iPhone設備實現一個UI佈局。請引導我。嘗試了很多次，花了大約3-4個小時，但沒有成功。請幫助我我還分享了我想要實現的佈局。

注意：請讓我知道如果有人沒有找到或沒有得到我的問題評論我。我會給你提供更多的信息，謝謝。 在先進的感謝

Answer 1

的關鍵是設定成比例的限制。

首先添加一個UIView來保存4個元素 - 背景，男人，女人和心臟。

爲背景添加一個UIImage，並將邊緣固定到視圖的邊緣 - 這是最簡單的部分。

添加UIImage的人...

• 設定縱橫比爲1：1，以保持它的平方（孔圓在這種情況下）。
• 將高度約束設置爲等於「包含」視圖的高度，但將乘數設置爲小於1以使其相對於視圖。在這種情況下，0.6非常接近。
• 爲居中水平和垂直設置約束...然後設置乘子以保持圖像離開中心和上方。水平爲0.64，垂直工作爲0.9。

添加女方UIImage ...

• 設置高度和寬度的限制等於男人的形象。
• 爲居中水平和垂直設置約束...然後設置乘子以保持圖像正確並在中心下方。水平方向1.4，垂直方向1.2相當好。

添加中心的UIImage ...

• 設定縱橫比爲1：1（或任何讓你有適當的比例對你的心臟圖像）。
• 將高度約束設置爲等於「包含」視圖的高度，但將乘數設置爲小於1以使其相對於視圖。在這種情況下，0.15非常接近。
• 爲居中水平和垂直設置約束...然後它將需要一點點調整注意垂直1.05爲我工作。

現在，您只需要爲「包含」視圖設置適當的約束，並且所有元素都會在其中進行縮放和定位。

當你全部完成，就應該（希望）是這樣的：

我把這個計劃了在GitHub庫，爲您看：https://github.com/DonMag/AnotherLayoutExample