使用自动布局支持不同 iPhone 大小的问题(包括图表)
Issue using auto-layout to support different iPhone sizes (diagrams included)
所有蓝色部分都是 ImageView 的一部分(在 Sketch 中设计 ==> 导出为 PNG ==> 导入到 ImageView 中)。因此,它可以在没有任何限制的情况下很好地扩展。检查图形变大,我的检查标记指示用户名和密码应该放在哪里。但是,我的 TextFields(电子邮件和 PIN)不会放大,也不会移动到复选标记指示的位置。我基本上希望它们保持在屏幕的相同相对部分(例如,距离左侧 40%,距离右侧 10%...),因为我认为这可以解决我的问题。我使用了各种约束(到 superview、leading 等)并尝试了一个容器,但没有任何效果。我当然可以再次导出不同尺寸的 Sketch 文件,但我认为我的背景图片没有任何问题。但是,我不能将我的背景图像拆分成更小的东西,因为我不想弄乱背景。此外,复选标记实际上是用户名和密码周围的框。假设除了将 imageView 绑定到边距之外,我没有其他限制。
谢谢!
--kmuzumdar
看起来如果您在 iPhone 6 的情况下打破了一些限制,或者您将 left 40% 设置为 Equal,请记住仅仅缩放是不够的,设备之间的屏幕比例也不同。
试试这个..
将电子邮件输入和Pin#设置为垂直居中并带有相应的复选标记
在复选标记及其标签之间设置大于或等于约束。让他们彼此远离。
您可能需要手动进行一些调整,为此您也可以随时使用 NSLayoutConstraint
的插座,只需检查您是否使用 iphone 6 并更改约束
的.constant
属性
This should do it:
let height = UIScreen.mainScreen().bounds.height
if height == 667 { // iphone 6 screen's height
//Adjust your constrains
}
- 此外,对于 6 或 6+,您也可以结束手动增加字体大小。
UPDATE:
阅读一些评论,我注意到了一些重要的事情,那就是你不能实例化复选标记来为它们添加约束,在这种情况下,你可以通过设备特定的约束来解决所有问题。
第 3 点和第 4 点中描述的那个。
只需继续并手动设置所有内容,根据您对每个设备屏幕的设计相应地更改您的约束 .constant
属性。 Here's a link to these sizes
恐怕没有更好的办法了。
我想到了一些其他的东西,一些非常强大的东西,那就是每个约束的 乘数 属性。我记得用它们来构建一个井字棋盘,通过这种技术设置线条的精确位置。所以,这可能是您的解决方案。 Here's a link 如何通过代码使用它们。一直往下看,直到看到副标题 Standard Programmatic Layout
你会发现这样的东西:
self.constraintToAnimate = [NSLayoutConstraint constraintWithItem:label
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeBottom
multiplier:0.25
constant:0.0];
[self.view addConstraint:constraint];
还有,下面的解释。
The first two parameters determine the target of the constraint,
label, and the attribute that is to be set: top. The third parameter,
relatedBy, accepts one of NSLayoutRelationEqual,
NSLayoutRelationGreaterThanOrEqual, or
NSLayoutRelationLessThanOrEqual. The next two parameters allow us to
set the source view and attribute from which we’ll derive a value.
Here we are saying that we want to use the bottom point of our
superview, which would be 568 points on a 4-inch device. Lastly we’ve
got a multiplier that we’ll use to derive our value — 0.25 (25%).
We’re not using the constant parameter, so we’ve set it to 0.0. Put
into a mathematical equation it would look something like this:
label.top = superview.bottom*0.25.
因此,这可以是另一种方式,不依赖于代码,因为这可以通过 Storyboard 实现。
所有蓝色部分都是 ImageView 的一部分(在 Sketch 中设计 ==> 导出为 PNG ==> 导入到 ImageView 中)。因此,它可以在没有任何限制的情况下很好地扩展。检查图形变大,我的检查标记指示用户名和密码应该放在哪里。但是,我的 TextFields(电子邮件和 PIN)不会放大,也不会移动到复选标记指示的位置。我基本上希望它们保持在屏幕的相同相对部分(例如,距离左侧 40%,距离右侧 10%...),因为我认为这可以解决我的问题。我使用了各种约束(到 superview、leading 等)并尝试了一个容器,但没有任何效果。我当然可以再次导出不同尺寸的 Sketch 文件,但我认为我的背景图片没有任何问题。但是,我不能将我的背景图像拆分成更小的东西,因为我不想弄乱背景。此外,复选标记实际上是用户名和密码周围的框。假设除了将 imageView 绑定到边距之外,我没有其他限制。
谢谢!
--kmuzumdar
看起来如果您在 iPhone 6 的情况下打破了一些限制,或者您将 left 40% 设置为 Equal,请记住仅仅缩放是不够的,设备之间的屏幕比例也不同。
试试这个..
将电子邮件输入和Pin#设置为垂直居中并带有相应的复选标记
在复选标记及其标签之间设置大于或等于约束。让他们彼此远离。
您可能需要手动进行一些调整,为此您也可以随时使用
NSLayoutConstraint
的插座,只需检查您是否使用 iphone 6 并更改约束 的
.constant
属性
This should do it:
let height = UIScreen.mainScreen().bounds.height
if height == 667 { // iphone 6 screen's height
//Adjust your constrains
}
- 此外,对于 6 或 6+,您也可以结束手动增加字体大小。
UPDATE:
阅读一些评论,我注意到了一些重要的事情,那就是你不能实例化复选标记来为它们添加约束,在这种情况下,你可以通过设备特定的约束来解决所有问题。
第 3 点和第 4 点中描述的那个。
只需继续并手动设置所有内容,根据您对每个设备屏幕的设计相应地更改您的约束 .constant
属性。 Here's a link to these sizes
恐怕没有更好的办法了。
我想到了一些其他的东西,一些非常强大的东西,那就是每个约束的 乘数 属性。我记得用它们来构建一个井字棋盘,通过这种技术设置线条的精确位置。所以,这可能是您的解决方案。 Here's a link 如何通过代码使用它们。一直往下看,直到看到副标题 Standard Programmatic Layout 你会发现这样的东西:
self.constraintToAnimate = [NSLayoutConstraint constraintWithItem:label
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeBottom
multiplier:0.25
constant:0.0];
[self.view addConstraint:constraint];
还有,下面的解释。
The first two parameters determine the target of the constraint, label, and the attribute that is to be set: top. The third parameter, relatedBy, accepts one of NSLayoutRelationEqual, NSLayoutRelationGreaterThanOrEqual, or NSLayoutRelationLessThanOrEqual. The next two parameters allow us to set the source view and attribute from which we’ll derive a value. Here we are saying that we want to use the bottom point of our superview, which would be 568 points on a 4-inch device. Lastly we’ve got a multiplier that we’ll use to derive our value — 0.25 (25%). We’re not using the constant parameter, so we’ve set it to 0.0. Put into a mathematical equation it would look something like this: label.top = superview.bottom*0.25.
因此,这可以是另一种方式,不依赖于代码,因为这可以通过 Storyboard 实现。