UIEdgeInsetsMake学习

参考链接
参考链接

在平常我们使用button的时候，需求可能是需要我们满足button的Image和Label的各种体位，这个使用我们就需要使用UIEdgeInsetsMake来满足下需求，通过设置button的image和label的insetEdge来满足。

UIEdgeInsetsMake 介绍

typedef struct UIEdgeInsets { 
  CGFloat top, left, bottom, right; // specify amount to inset (positive) for each of the edges. values can be negative to 'outset'
} UIEdgeInsets;

是一个结构体，里面有四个属性，上左下右，看注释大概意思是说
为每条边指定插入量。正值的话是距离边多多少，负值的话是距离边少多少

引用：
图中，蓝色标识为可变区域， 绿色标识为不变区域。UIEdgeInsets结构体的属性top与bottom为一对，用来指定纵向可变区域（黑色虚线矩形），left与right为一对，用来指定横向可变区域(白色虚线矩形)。当UIButton/UIImageView的size大于UIImage的size时，会调整图片中可变区域大小以铺满整个控件,具体调整规则如下：
(1)控件宽度大于图片宽度，拉伸白色虚线矩形
(2)控件高度大于图片高度，拉伸黑色虚线矩形
(3)控件宽度小于图片宽度时，横向整体缩小(可变区与不变区比例不变)
(4)控件高度小于图片高度时，纵向整体缩小(可变区与不变区比例不变)

实战

其实很简单，目标实现这样的一个button

我们现在的样子是这样的

• 第一步我们先将image和label都居中放置

  我们让label向左便宜-imageWidth (意思就是让他往左走了imageView的宽度)
   [button setTitleEdgeInsets:UIEdgeInsetsMake(0, -imageWidth, 0, 0)];
   让image向右走-titleLabeWidth (意思是让他向右左了titleLabel的宽度)
   [button setImageEdgeInsets:UIEdgeInsetsMake(0, 0, 0, -titleLabelWidth)]; 
  

  设置完这些后我们看下当前的效果 我们发现现在image和label都是处在居中的状态下

• 第二步我们在设置下上下的间距

  让titleLabel向下偏移- imageHeight - space (意思是向下走了图片的高度+偏移)
   [button setTitleEdgeInsets:UIEdgeInsetsMake(0, -imageWidth, -imageHeight - space, 0)];
   同理设置imageView的偏移
  [button setImageEdgeInsets:UIEdgeInsetsMake(-titleLabelHeigt - space, 0, 0, -titleLabelWidth)];
  

最后就实现了我们需要的效果

其实设置很简单，想清楚我们要怎么移动我们的内部空间，比如向上移动就是设置top属性同时设置一个负值这样的话对应的控件就会上移，按照这种思路设置的EdgeInset的属性都是负值