在 Interface Builder 中,如果我使對齊與安全區域成比例或與 Superview 成比例,則為 UI 元素(比方說按鈕)設定約束不會改變。
我有一個按鈕,我將其水平對齊設定為:

我有另一個按鈕,我將其水平對齊設定為:

兩個按鈕最終水平對齊:

我本來希望與安全區域對齊的按鈕向右移動,因為安全區域的前沿從 Superview 之一向右移動。我可能遺漏了一些東西,但不太明白這里發生了什么。
The problem is that heights and widths proportional to the Safe Area are honored, so the size of UI elements does change if you make them proportional to the Safe Area or to the Superview. So when you try to layout something with Safe Area proportional heights and widths, and also use Safe Area proportional horizontal and vertical placements, UI Elements don't line up for iPhones with a notch. They kind of lineup for devices like iPads and iPhones with no notch where the Safe Area is very close to the Superview area.
uj5u.com熱心網友回復:
一些事情可能會導致混亂......
首先,它有助于添加一個(黃色)視圖,限制在安全區域的所有 4 個邊上(使用 iPhone 13 Pro 布局):


如您所見,安全區域有 44 點的領先和尾隨。
因此,在 Portrait Orientation 中,Superview 和 Yellow 視圖的 Width390.0和 CenterX 的值都是195.0。
When rotated to Landscape, the Superview Width is 844.0 while the Yellow view (constrained to Safe Area) Width is only 756.0 ... that is, 44-pts on each side.
However, the CenterX value is the same: 422.0
So, when we constrain a view / label Leading to CenterX of either the Superview or Safe Area with a 0.5 Multiplier, the resulting X / Leading value will be 422.0 * 0.5 == 211.0
Take a look at this example using these constraints:

L1 Leading is
Superview.centerX * 0.5L2 Leading is
SafeArea.centerX * 0.5L3 CenterX is
Superview.centerXL4 Leading is
L3.centerX * 0.5L5 CenterX is
SafeArea.centerXL6 Leading is
L5.centerX * 0.5L7 CenterX is
Superview.centerX(but Width: 240 instead of 120)L8 Leading is
L7.centerX * 0.5
As we see, all of the "50% of CenterX" labels are aligned.
And, we get the same alignment when rotated:

Worth noting: If you try to do the same thing with Top and CenterY constraints, you WILL see an immediate difference... because when rotated to Landscape Orientation, the Safe Area Top and Bottom "padding" are not the same.
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/451939.html
標籤:ios iphone xcode storyboard interface-builder
