如何使用一个故事板用于带有自动布局(ios6 + ios7)的4英寸和3.5英寸iphone屏幕?

gar*_*ine 25 iphone interface-builder ios autolayout nslayoutconstraint

虽然有很多关于构建故事板布局的问题和答案,它可以在4"和3.5"屏幕尺寸上工作,但我找不到适合以下场景的解决方案.

我使用autolayout和ios6(和ios7),我不需要支持landscpae或ipad.我有一个带有几个子视图的UIView,它们必须看作下面的模型.可以轻松地在故事板中设置自动布局约束以适应任一屏幕尺寸.我的问题是 - 如何根据运行时的屏幕大小使autolayout选择正确的约束?

屏幕MOCKUPS

请注意,我不想使用2个不同的故事板.在我的整个应用程序中这样做将需要做很多工作,而且我必须在每个故事板上连接所有代理,出口和操作.屏幕上的变化需要我做两倍的工作.

我已经尝试了两种方法在一个故事板上完成这项工作,但我对其中任何一个都不满意.

  • 加倍约束.较大的约束(50)具有比较低约束(30)更高的优先级.这种方法的问题在于,在3.5英寸屏幕尺寸上,自动布局可能只选择几个较低优先级的约束 - 足以满足布局 - 但保留一些高优先级约束.

双重约束

  • 子类NSLayoutConstraint.在此方法中,故事板中的所有约束都设置为NSDualLayoutConstraint.在NSDualLayoutConstraint的初始化代码中,如果运行时屏幕大小为3.5",则约束的常量将更改为3_5_constant的值.此方法更具确定性,但您无法在界面构建器预览中看到3.5"布局.

在此输入图像描述


如果只有界面构建器约束具有将在屏幕大小为3.5"时应用的辅助常量值,那么它将解决我的问题.所以我仍然问我的问题 - 如何正确使用单个故事板来正确布局其子视图屏幕尺寸为4"和3.5"?

Jer*_*Fox 6

如果您只想使用一个故事板而又不想使用自动布局,这会使您的图表中显示的内容变得更加容易,您将不得不在代码中布局视图.

您只需要检测用户是否在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
}
Run Code Online (Sandbox Code Playgroud)

但是,如果你为此使用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];
Run Code Online (Sandbox Code Playgroud)


Wol*_*ink 1

您需要以编程方式编辑约束。 您可能会发现这个问题对此很有帮助。

您还可以在一个 Storyboard 文件中拥有两个单独的 Storyboard 文件,或两个 viewController 场景。