简书上讲autolayout的文章很多,但大多数是从理论上来讲的,我这里说一个平时开发中常见到的一种需求,先看一下俩张图吧。
简单的说明一下就是当文字多的时候图片会往后走,但是图片不能到屏幕以外,最多和屏幕边距保持10个像素的距离。当字再多的时候,会自动换行。iOS的小伙伴们,想一下这样的需求用autolayout改如何实现呢?
解决方案
- 拖一个label再拖一个imageView到你的storyBoard或者Xib文件上,先来约束label:据左--给个10吧,居上--你随意吧(或者设置成垂直居中),然后宽度:这块你得添加个约束,否则文字特别多的时候,就会超出屏幕的,所以你先写个320吧(这数字随便),默认的会是等于,你这里需要把它改成小于等于。高度:你随意设置,也可以不管,如果你想显示很多行,那么久设置的大点,或者不设置。
- label设置完了,下面设置imageView的约束条件:据左--相对于label定死10吧.据上--你随便吧,自身的宽高约束一下--都是50吧。然后就可以不管了。
- 因为需要屏幕适配,你不知道屏幕的宽具体是多少,所以需要你把步骤1中的设置label宽的那个约束找到,然后拖一个IBOutlet出来,就类似与你平时拖一个label的IBOutlet一样。
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *screenW;
名字我随便起的。拖出来的约束在viewDidload里面修改一下``` self.screenW.constant = [UIScreen mainScreen].bounds.size.width-70;//imageView--50 两边个间距10,所以label宽度不能大于屏幕宽度减去70
>试想一下,如果你用纯代码完成这样的需求需要多少行代码呢?按照这个思路你可以完成很多类似的复杂一些的需求哦😊
#Demo演示
       github上传了Demo地址:[https://github.com/iOSKesai/autolayoutDemo.git](https://github.com/iOSKesai/autolayoutDemo.git),有兴趣的小伙伴可以下载看一下很简单。
#备注
![设置说明](http://upload-images.jianshu.io/upload_images/1538778-36a47f86dc536352.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)