关于UIbutton的imageEdgeInsets、titleEdgeInsets属性

屏幕快照 2016-07-27 02.48.40 PM.png

UI设计的这种样子的按钮，以前时间紧遇到这种需求就用最low的方式imageview+label，最近稍微有点时间，实在是看不下去，抽空看了一下button的imageEdgeInsets和titleEdgeInsets属性，使用这两个属性的前提是button的size足以放下image和label，写一写个人总结

按钮默认显示的样子是image在左label在右，居中显示
实现需求的时候首先设置了contentHorizontalAlignment为UIControlContentHorizontalAlignmentRight，默认居中调整insets时好像有一点偏差，left跟right类似，大同小异

无标题绘图.png

图1是设置UIControlContentHorizontalAlignmentRight还未调整insets
图2是调整过insets的样子
UIEdgeInsets有四个属性，top, left, bottom, right分别代表四个方向，箭头所示为正方向，远离箭头的方向为负方向

以图1为参照，从图2到图1
以图1为参照，从图2到图1
以图1为参照，从图2到图1
（重要说三遍...）

首先分析图片（向下的白色箭头为图片...）
image右边（right方向）向左移动了label宽度（26）距离，另一种描述方式，right向右为正向，image右边向右移动了-26；
image左边（left方向）向左移动了label宽度（26）距离；
所以 button.imageEdgeInsets = UIEdgeInsetsMake(0, 26, 0, -26);

分析label（红色定位）
label左边向右移动了image宽度（11）距离，另一种描述方式，left向左为正向，label左边向左移动了-11；
label右边向右移动了image宽度（11）距离；
所以 button.titleEdgeInsets = UIEdgeInsetsMake(0, -11, 0, 11);

设置完成之后就显示成图2的样子，这个是调整完成之后从后往前推出来的结论，但是按照正常的思路来讲应该将2设置参照，计算1移动到2的各种距离，但是这样计算的结果恰好是相反的。
以上为个人见解，欢迎批评指正！

附上参考链接http://stackoverflow.com/questions/4564621/aligning-text-and-image-on-uibutton-with-imageedgeinsets-and-titleedgeinsets