Storyboard使用技巧:使用比例方式布局

Storyboard对于多屏幕适配来讲再合适不过了!可是有一些技巧可能很容易被忽略,今天要介绍的使用比例来控制布局可能就是其中之一。布局

在实际项目开发过程当中,有些布局是按照比例来肯定大小的,这个时候用下面的方法能够减小你的代码量,彻底能够在Storyboard中完成!spa

下面介绍subview相对于superview的比例。完成从一个控制器里面添加一个Button,并使Button.width = Button.superview.width/4;code

Step 1 添加一个UIButton,并使用布局使它居于view中心

  • Storyboard中添加一个UIViewController,而后往里面添加一个UIButton
  • 选中Button,在右下角的快捷操做中如图所示进行设置,点击Add 2 Constraints
    图片描述
  • 此时,你可能还须要再次选中这个Button,再使用快捷键Command+option+=修复frame,这时Button的frame和layout的约束才会对应起来。若是不修复frame也不会影响实际运行的效果,可是Xcode会提示警告!

Step 2

  • 在View的树形图中,先选中View再选中Button
    图片描述
  • 如图所示添加约束,勾选Equal Widths,点击Add 2 Constraints
    图片描述

Step 3

  • 选中Button如图所示编辑约束的参数,Multiplier设置为1:4
    图片描述
    图片描述

Done

  • Command+option+=修复frame
    图片描述

补充

  • 相同层级和不一样层级的view之间均可以用这种比例方式肯定大小,可是必须有条件先肯定其中一个view的大小。这里说的条件,指的是约束,或者UIViewController.view这种由父级容器肯定了大小的条件。
  • 通常状况下,宽度和高度须要分别设置比例,看需求而定。
  • 宽度和高度之间也能够设置比例,设置方法和上面基本相同,不一样的是,只须要选择一个view,添加约束的时候只勾选Aspect Ratio,设置比例的方法同上。
相关文章
相关标签/搜索