iOS自动布局混乱

时间:2015-02-28 09:35:35

标签: ios autolayout scale

我真的很想弄清楚如何将项目添加到自动布局并让它们缩放,以便无论使用什么设备它们都位于相同的屏幕中。例如,在下面的图像中,我希望按钮位于4英寸,4.7英寸和5.5英寸的iPhone上。我还希望按钮在每个设备上为两个方块高,两个方形宽。

任何指导都将受到高度赞赏。

由于

enter image description here

修改

我刚刚发现,通过将约束应用于父视图中心,将常量设置为0并调整约束乘数,可以将项位置缩放到屏幕大小。但是,将项目缩放到屏幕大小似乎是一种非常费力的方法。有没有更简单的方法。

3 个答案:

答案 0 :(得分:0)

您希望指定与正方形的大小(宽度)成比例的button的位置和大小。由于方形宽度由superview大小决定,您希望得到如下内容:

button.width  = (superview.width / 9) * 2 
button.height = (superview.width / 9) * 2
button.x      = (superview.width / 9) * 2
button.y      = (superview.width / 9) * 2

通过添加相等的宽度/高度约束并调整乘数,可以在AutoLayout中轻松设置比例宽度/高度(一旦指定了一个尺寸,就可以通过纵横比约束指定另一个尺寸)。

不幸的是,不能直接在Autolayout中指定比例位置(间距)。解决方法是使用附加到spacingViewsuperview的透明button,并将其维度设置为与supeview成比例。

V:[superview]-0-[spacingView]-0-[button]
H:[superview]-0-[spacingView]-0-[button]

spacingView.width  = superview.width / 4.5
spacingView.height = superview.width / 4.5

答案 1 :(得分:0)

由于我看到您将checkers.jpg图片作为背景,因此您无法使用任何通用解决方案,您需要在任何设备尺寸中修复此位置。

答案 2 :(得分:0)

以下是我取得的成就:

example

  1. 要使按钮在差异屏幕中按比例缩放设置宽度和高度,使按钮等于超视图的宽度/高度。然后将设置乘数设置为1:X,其中X是屏幕上的方格数。
  2. button widht/height

    1. 按比例保持按钮添加2个间隔视图 - 一个用于顶部空间,一个用于左侧(绿色和蓝色在我的屏幕截图中)。 下一步添加约束:
    2. (水平)[superview left]-0-[left spacer]-0-[button]

      (垂直)[superview top]-0-[top spacer]-0-[button]

      对于间隔视图的宽度/高度,使用与superview相同宽度/高度的相同技巧: top spacer left spacer

      然后要在屏幕上移动按钮,您只需要更改间隔视图的多个部分。

      按钮的宽度可以通过相等宽度的倍数和从按钮到超视图的相同高度约束来控制。

      2 tiles width/height