iPhone 上通用故事板的限制
Constraints for universal storyboard on iPhones
如今,我在 iOS 上遇到了不同屏幕尺寸的限制。
我尝试了 google 和 Whosebug 来寻找解决方案,但我的英语似乎不够流利,无法找到答案。
我有 4 个垂直对齐的按钮,第一个和最后一个按钮受屏幕边缘的限制(有点简单)。但我真的很难受中间两个按钮的限制。我找不到让它们在每个尺寸的屏幕上与左右按钮等距的方法。
是否有简单和棘手的方法来使这些约束正确?还是我做错了,我应该尝试以编程方式进行吗?
谢谢
在每个按钮的中间添加三个不可见视图,使它们的宽度与约束彼此相等,然后您的四个按钮将等距。对于 Y 然后你只需要将它固定在你想要的地方。
如果您打算仅支持 iOS 9 及更高版本,请使用 UIStackView
.
这个问题的解决方法很简单。这可以使用 "spacer views" 的概念来解决。您必须在每个红色视图之间放置不可见视图。在您的情况下,您需要 3 个。然后将它们的背景设置为清晰的颜色。 .
接下来,使它们的宽度相等,并将它们的边缘限制在该视图之后和之前的视图中。然后定义红色视图的大小。
记住不要给 "clear coloured views" 任何固定的宽度。这将决定由 runtime.This 是否可以解决问题。如果需要更多信息,请告诉我。
这是解决此问题的博客 post
http://adamdelong.com/fluid-layouts-with-auto-layout-size-classes-spacer-views-and-constraint-priorities/
这是这个的 YouTube 视频
https://www.youtube.com/watch?v=eSG-3-QpmWk&feature=youtu.be
除了 Tj3n 对按钮之间视图的回答外,您还可以使用
- 一个 UIStackView (iOS 9!) 用于设置
Axis: horizontal
, Distribution: equal spacing
- 一个工具栏(取决于你想用你的按钮做什么),带有工具栏项目和它们之间灵活的 Space
您可以使用方程来获得这种外观。
使用视图的尾随点来获取它。
View1.trailing = superview.trailing*(2.0f/9.0f)
View2.trailing = superview.trailing*(4.0f/9.0f)
View3.trailing = superview.trailing*(6.0f/9.0f)
View4.trailing = superview.trailing*(8.0f/9.0f)
如果你View1.width = superview.width*(1/9.0f)
你可以实现你想要的。
这个问题有很多类似的解决方案。但基地正在使用尾随点。
也可以使用视图的 centerX 位置来完成。
View1.centerX = superview.trailing*(3.0f/15.0f)
View2.centerX = superview.trailing*(6.0f/15.0f)
View3.centerX = superview.trailing*(9.0f/15.0f)
View4.centerX = superview.trailing*(12.0f/15.0f)
为什么不是尺寸 classes? Apple 在 iOS 8 中引入了自适应用户界面的概念,依赖于自动布局和大小 classes 的组合。
如果您不知道什么是大小 classes,有很多可用的教程,请找一个。
总结:Apple 非常巧妙地删除了 iphone 和 ipad 的两个故事板,并为通用应用程序制作了一个故事板。不,您不必努力尝试应用满足所有屏幕尺寸的自动布局约束:)
下面是一些 classes 的大小及其含义:)
常规宽度 x 常规高度 ----> iPad 纵向 mode/ipad 横向模式
Compact width x Regular Height ----> iPhone 6 plus,iPhone 6,iPhone 5s,iPhone 5,iPhone 4s 肖像模式
Compact width X Compact Height ----> iPhone 6,iPhone 5s,iPhone 5,iPhone 4s 横向模式
常规宽度 x 紧凑高度 ----> iphone 6 加横向模式。
您可以 select 您想要从故事板支持的大小 classes :) 并开始应用针对每个大小 classes 的特定约束(如中间的按钮)或如果你有通用的(比如你的按钮固定在屏幕上)所有尺寸 classes.
您可以部署、删除、重用或删除各种大小的约束 classes。
总结:伙计,如果你还没有使用大小class,现在是开始使用它的好时机:) 我相信在 2014 年苹果 WWDC 会议上有一个精彩的视频。下载、观看、开始使用它。
编码愉快:)
感谢 LearneriOS 的回答,我解决了我的问题。
为了得到我想要的结果,我创建了 3 个宽度为 10 的视图。
我的第一个和最后一个按钮已经被约束。我将我的第一个额外视图限制在我的第一个具有水平间距的按钮上,然后我将我的第一个额外视图限制在容器中的垂直中心。然后我将额外的视图限制在他自己的宽度和高度上。
重要的部分来了:我确实进入了约束菜单并选择了宽度约束。里面的值仍然是 10 但我确实将优先级从 1000 更改为 750.
然后我确实复制了我的第一个额外视图并将它们全部限制到最近的按钮,就像我对第一个 entra 视图所做的一样但是我删除了它们的宽度限制(除了第一个之外的所有额外视图)并通过插入以下内容来限制第一个视图的额外视图:等于宽度。
然后我得到了我的结果,我希望它足够清楚,再次感谢。
如今,我在 iOS 上遇到了不同屏幕尺寸的限制。
我尝试了 google 和 Whosebug 来寻找解决方案,但我的英语似乎不够流利,无法找到答案。
我有 4 个垂直对齐的按钮,第一个和最后一个按钮受屏幕边缘的限制(有点简单)。但我真的很难受中间两个按钮的限制。我找不到让它们在每个尺寸的屏幕上与左右按钮等距的方法。
是否有简单和棘手的方法来使这些约束正确?还是我做错了,我应该尝试以编程方式进行吗?
谢谢
在每个按钮的中间添加三个不可见视图,使它们的宽度与约束彼此相等,然后您的四个按钮将等距。对于 Y 然后你只需要将它固定在你想要的地方。
如果您打算仅支持 iOS 9 及更高版本,请使用 UIStackView
.
这个问题的解决方法很简单。这可以使用 "spacer views" 的概念来解决。您必须在每个红色视图之间放置不可见视图。在您的情况下,您需要 3 个。然后将它们的背景设置为清晰的颜色。 . 接下来,使它们的宽度相等,并将它们的边缘限制在该视图之后和之前的视图中。然后定义红色视图的大小。 记住不要给 "clear coloured views" 任何固定的宽度。这将决定由 runtime.This 是否可以解决问题。如果需要更多信息,请告诉我。
这是解决此问题的博客 post http://adamdelong.com/fluid-layouts-with-auto-layout-size-classes-spacer-views-and-constraint-priorities/
这是这个的 YouTube 视频 https://www.youtube.com/watch?v=eSG-3-QpmWk&feature=youtu.be
除了 Tj3n 对按钮之间视图的回答外,您还可以使用
- 一个 UIStackView (iOS 9!) 用于设置
Axis: horizontal
,Distribution: equal spacing
- 一个工具栏(取决于你想用你的按钮做什么),带有工具栏项目和它们之间灵活的 Space
您可以使用方程来获得这种外观。 使用视图的尾随点来获取它。
View1.trailing = superview.trailing*(2.0f/9.0f)
View2.trailing = superview.trailing*(4.0f/9.0f)
View3.trailing = superview.trailing*(6.0f/9.0f)
View4.trailing = superview.trailing*(8.0f/9.0f)
如果你View1.width = superview.width*(1/9.0f)
你可以实现你想要的。
这个问题有很多类似的解决方案。但基地正在使用尾随点。 也可以使用视图的 centerX 位置来完成。
View1.centerX = superview.trailing*(3.0f/15.0f)
View2.centerX = superview.trailing*(6.0f/15.0f)
View3.centerX = superview.trailing*(9.0f/15.0f)
View4.centerX = superview.trailing*(12.0f/15.0f)
为什么不是尺寸 classes? Apple 在 iOS 8 中引入了自适应用户界面的概念,依赖于自动布局和大小 classes 的组合。
如果您不知道什么是大小 classes,有很多可用的教程,请找一个。
总结:Apple 非常巧妙地删除了 iphone 和 ipad 的两个故事板,并为通用应用程序制作了一个故事板。不,您不必努力尝试应用满足所有屏幕尺寸的自动布局约束:)
下面是一些 classes 的大小及其含义:) 常规宽度 x 常规高度 ----> iPad 纵向 mode/ipad 横向模式 Compact width x Regular Height ----> iPhone 6 plus,iPhone 6,iPhone 5s,iPhone 5,iPhone 4s 肖像模式 Compact width X Compact Height ----> iPhone 6,iPhone 5s,iPhone 5,iPhone 4s 横向模式 常规宽度 x 紧凑高度 ----> iphone 6 加横向模式。
您可以 select 您想要从故事板支持的大小 classes :) 并开始应用针对每个大小 classes 的特定约束(如中间的按钮)或如果你有通用的(比如你的按钮固定在屏幕上)所有尺寸 classes.
您可以部署、删除、重用或删除各种大小的约束 classes。
总结:伙计,如果你还没有使用大小class,现在是开始使用它的好时机:) 我相信在 2014 年苹果 WWDC 会议上有一个精彩的视频。下载、观看、开始使用它。
编码愉快:)
感谢 LearneriOS 的回答,我解决了我的问题。
为了得到我想要的结果,我创建了 3 个宽度为 10 的视图。
我的第一个和最后一个按钮已经被约束。我将我的第一个额外视图限制在我的第一个具有水平间距的按钮上,然后我将我的第一个额外视图限制在容器中的垂直中心。然后我将额外的视图限制在他自己的宽度和高度上。
重要的部分来了:我确实进入了约束菜单并选择了宽度约束。里面的值仍然是 10 但我确实将优先级从 1000 更改为 750.
然后我确实复制了我的第一个额外视图并将它们全部限制到最近的按钮,就像我对第一个 entra 视图所做的一样但是我删除了它们的宽度限制(除了第一个之外的所有额外视图)并通过插入以下内容来限制第一个视图的额外视图:等于宽度。
然后我得到了我的结果,我希望它足够清楚,再次感谢。