如何使用一個故事板用於帶有自動布局（ios6 + ios7）的4英寸和3.5英寸iphone屏幕？

Question

雖然有很多關於構建故事板布局的問題和答案，它可以在4“和3.5”屏幕尺寸上工作，但我找不到適合以下場景的解決方案。

我使用autolayout和ios6（和ios7），我不需要支持landscpae或ipad。 我有一個帶有幾個子視圖的UIView，它們必須看作下面的模型。 可以輕松地在故事板中設置自動布局約束以適應任一屏幕尺寸。 我的問題是 - 如何根據運行時的屏幕大小使autolayout選擇正確的約束？

請注意，我不想使用2個不同的故事板。 在我的整個應用程序中這樣做將需要做很多工作，而且我必須在每個故事板上連接所有代理，出口和操作。 屏幕上的變化需要我做兩倍的工作。

我已經嘗試了兩種方法在一個故事板上完成這項工作，但我對其中任何一個都不滿意。

• 加倍約束。 較大的約束（50）具有比較低約束（30）更高的優先級。 這種方法的問題在於，在3.5英寸屏幕尺寸上，自動布局可能只選擇幾個較低優先級的約束 - 足以滿足布局 - 但保留一些高優先級約束。

• 子類NSLayoutConstraint。 在此方法中，故事板中的所有約束都設置為NSDualLayoutConstraint。 在NSDualLayoutConstraint的初始化代碼中，如果運行時屏幕大小為3.5“，則約束的常量將更改為3_5_constant的值。此方法更具確定性，但您無法在界面構建器預覽中看到3.5”布局。

---

如果只有界面構建器約束具有將在屏幕大小為3.5“時應用的輔助常量值，那么它將解決我的問題。所以我仍然問我的問題 - 如何正確使用單個故事板來正確布局其子視圖屏幕尺寸為4“和3.5”？

Answer 1

如果您只想使用一個故事板而又不想使用自動布局，這會使您的圖表中顯示的內容變得更加容易，您將不得不在代碼中布局視圖。

您只需要檢測用戶是否在4“設備上運行並相應地布局視圖。

#define IS_568_SCREEN (fabs((double)[[UIScreen mainScreen]bounds].size.height - (double)568) < DBL_EPSILON)

if (IS_568_SCREEN) {
    // Lots of code to layout for 4" devices
} else {
    // Lots of code to layout for 3.5" devices
}

但是，如果你為此使用autolayout，你會發現它會為你節省大量的時間和代碼。 使用上面提到的解決方案而不必手動布局代碼中的每個視圖，您只需要根據設備更新y和高度約束。

考慮到這個圖表顯示了autolayout將為您處理什么以及您需要手動更新的內容，這應該有助於描繪出利用自動布局可以節省多少錢。

#define IS_568_SCREEN (fabs((double)[[UIScreen mainScreen]bounds].size.height - (double)568) < DBL_EPSILON)

if (IS_568_SCREEN) {
    self.layoutConstraintY.constant = 50.0f;
    self.layoutConstraintHeight.constant = 248.0f;
} else {
    self.layoutConstraintY.constant = 30.0f;
    self.layoutConstraintHeight.constant = 220.0f;
}
[self layoutIfNeeded];

Answer 2

這個stackoverflow的答案為我解決了同樣的問題。

關鍵是使IBOutlet達到約束（例如高度）。 然后做這樣的事情

- (void)updateViewConstraints {
    [super updateViewConstraints];

    self.myConstraintFromIB.constant =
        [UIScreen mainScreen].bounds.size.height > 480.0f ? 200 : 100;
}

Answer 3

您需要以編程方式編輯約束。 您可能會發現此問題對此有幫助。

您還可以在一個storyboard文件中有兩個單獨的Storyboard文件或兩個viewController場景。

Answer 4

如何添加額外的視圖並在其中包含方形視圖？ 額外的視圖應該是透明的，所以沒有人看到它。 設置額外視圖的約束以使用屏幕大小進行擴展，並將方形視圖的約束設置為在額外框中居中。 選擇相對於額外框的方形視圖大小的乘數