button中image和title的位置

本文介绍button中title和image的相对位置以实现如下效果

github地址,下载点我：实现了一个button的分类，有4中位置可以选择

效果图：

关键属性：EdgeInsets

titleEdgeInsets是titleLabel相对其上下左右的inset
如果只有title，那么titleLabel的上下左右都是相对于button的
如果只有image，那么image的上下左右都是相对于button的
如果同时有image和title，那么image的上左下相对于button，右相对于label
label的上右下是相对于button的，左是相对于image的

1.文字在左 图片在右

imageEdgeInsets = UIEdgeInsetsMake(0, labelW + space / 2, 0, -labelW - space / 2);
titleEdgeInsets = UIEdgeInsetsMake(0, -imageW - space / 2, 0, imageW + space / 2);

计算方式：

label的左边相对于button的左边来说是靠近，所以- ; label的右边相对于button的右边是远离，所以是+
image的左边相对于button的左边来说是远离，所以为+ ; image的右边相对于button的右边来说是靠近，所以是 -

2.文字在右 图片在左

imageEdgeInsets = UIEdgeInsetsMake(0, -space / 2, 0, space / 2);
titleEdgeInsets = UIEdgeInsetsMake(0, space / 2, 0, -space / 2);

计算方式：

label的左边相对于button的左边来说是远离，所以+ ; label的右边相对于button的右边是靠近，所以是-
image的左边相对于button的左边来说是靠近，所以为- ; image的右边相对于button的右边来说是远离，所以是 +

3.文字在上 图片在下

imageEdgeInsets = UIEdgeInsetsMake(0, -labelW / 2, -labelH - space / 2, -labelW);

titleEdgeInsets = UIEdgeInsetsMake(0, -imageW / 2, imageH +space / 2, labelW);

更准确的来说，应该是下面这种格式：

imageEdgeInsets = UIEdgeInsetsMake(labelH / 2 + space / 4, labelW / 2, -labelH / 2 - space / 4, -labelW / 2);

titleEdgeInsets = UIEdgeInsetsMake(-imageH / 2 - space / 4, - imageW / 2, imageH / 2 + space / 4, imageW / 2);

计算方式
image相对于label来说，往下移了labelH ／ 2 + space ／ 4的距离，label相对于image来说，往上移了imageH ／2 + space ／ 4的距离，整体来看，image的上面相对于button的上面远离是+，image的下面相对于button的下面是靠近，所以是-，然后把image移到中间去，image向右移，image的左边相对于button的左边，远离所以是+，image的右边相对于button的右边靠近，所以是-，同理 label也是这样

还可以变形为：

imageEdgeInsets = UIEdgeInsetsMake(labelH + space / 2, -labelW / 2, 0, -labelW);

titleEdgeInsets = UIEdgeInsetsMake(-imageH -space / 2, -imageW / 2, 0, labelW);

4.文字在下 图片在上

imageEdgeInsets = UIEdgeInsetsMake(-labelH / 2 - space / 4, labelW / 2, labelH / 2 + space / 4, - labelW / 2);

titleEdgeInsets = UIEdgeInsetsMake(imageH / 2 + space / 4, -imageW / 2, - imageH / 2 - space / 4, imageW / 2);

同理可以写成3里面的格式
所以，搞清楚相对位置来说就知道了距离，然后判断远离或者是靠近就知道了符号，总结的规律就是，靠近就为-，远离就为+