UIButton的UIEdgeInsetsMake属性(setTitleEdgeInsets,setImageEdgeInsets)

一.UIEdgeInsetsMake的四个属性

UIEdgeInsetsMake 有四个属性,依次是 Top,left,bottom,right

[Btn setTitleEdgeInsets:UIEdgeInsetsMake( top,  left,  bottom,  right)];

四个属性的默认值为0,拿其中一个left属性来聊, 你可以理解为文字距离Btn左边界的“位移”是0,

如果给left一个正值(例如40),即说明 文字距离左边界位增加了40个距离(即向右边移动了40个距离).

(注意⚠️:这个左边界不是btn的左边,而是btn.titleLabel 的左边)

对比下图,红色Btn设置了属性[redbBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 40, 0, 0)];

即红色Btn的文字距离左边界位增加了40个距离(即向右边移动了40个距离).

如果给left一个负值(例如-40),即说明 文字距离左边界位增加了-40个距离(即向左边移动了40个距离).

如下图:

由以上两个示例我们可以得出结论:

1.给left设置正值,则title往右边移动,即距离左边界移动xx距离(原本默认距离为0);给left设置负值,则title往左边移动.

以此类推,其他3个属性也是这样.设置top正值,title往下边移动,设置负值,title往上边移动……

如果同时给left和right都设置相同的正值,则实际上title不移动:

给left设置了正值40,往右移动

[redbBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 40, 0, 0)];

给right设置了正值40,往左移动

[redbBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 0, 0, 40)];

一左一右都移动40,等同于不移动

总之,明白了属性的道理,上左下右各种组合你就慢慢玩吧.

以上是btn的文字title的处理,Btn的iamgeView也是这个意思.

那么文字+图片该怎么设置呢?

二.文字+图片

同时给Btn设置了文字和图片,系统默认图片在左,文字在右. 而且还是仅仅挨着的:

    UIButton * redbBtn = [[UIButton alloc]initWithFrame:CGRectMake(100, 200, 150, 80)];redbBtn.backgroundColor = [UIColor redColor];[redbBtn setTitle:@"Btn文字" forState:UIControlStateNormal];[redbBtn setImage:[UIImage imageNamed:@"new_delete"] forState:UIControlStateNormal];[self.view addSubview:redbBtn];

我们可以设置setTitleEdgeInsets的left属性为正值(或者right属性为负值),让文字往右边移动

[redbBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 20, 0, 0)];
//或者
//[redbBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, 0, 0, -20)];

也可以设置setImageEdgeInsets的right属性为正值(或者left属性为负值),让图片往左边移动

[redbBtn setImageEdgeInsets:UIEdgeInsetsMake(0, -20, 0, 0)];
//或者
//[redbBtn setImageEdgeInsets:UIEdgeInsetsMake(0, 0, 0, 20)];

当然20这个值不是随便设置的,要根据title和iamge的宽度(或者高度),以及Btn的高度或者宽度来协调.

读懂了以上的几个属性.

我们处理成四个样式

1.图片在左,文字在右;2.图片在右,文字在左;3.图片在上,文字在下;4.图片在下,文字在上;

代码如下:

- (void)setBtnImageAndTitle:(UIButton *)btn WithStyle:(NSString *)style Spacing:(CGFloat)spacing
{if ([style isEqualToString:@"top"]){CGFloat imageW = btn.imageView.frame.size.width;CGFloat imageH = btn.imageView.frame.size.height;CGFloat titleIntrinsicContentSizeW = btn.titleLabel.intrinsicContentSize.width;CGFloat titleIntrinsicContentSizeH = btn.titleLabel.intrinsicContentSize.height;btn.imageEdgeInsets = UIEdgeInsetsMake(- titleIntrinsicContentSizeH - spacing, 0, 0, - titleIntrinsicContentSizeW);btn.titleEdgeInsets = UIEdgeInsetsMake(0, - imageW, - imageH - spacing, 0);}else if ([style isEqualToString:@"left"]){if (btn.contentHorizontalAlignment == UIControlContentHorizontalAlignmentLeft) {btn.titleEdgeInsets = UIEdgeInsetsMake(0, spacing, 0, 0);} else if (btn.contentHorizontalAlignment == UIControlContentHorizontalAlignmentRight) {btn.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, spacing);} else {btn.imageEdgeInsets = UIEdgeInsetsMake(0, - 0.5 * spacing, 0, 0.5 * spacing);btn.titleEdgeInsets = UIEdgeInsetsMake(0, 0.5 * spacing, 0, - 0.5 * spacing);}}else if ([style isEqualToString:@"bottom"]){CGFloat imageW = btn.imageView.frame.size.width;CGFloat imageH = btn.imageView.frame.size.height;CGFloat titleIntrinsicContentSizeW = btn.titleLabel.intrinsicContentSize.width;CGFloat titleIntrinsicContentSizeH = btn.titleLabel.intrinsicContentSize.height;btn.imageEdgeInsets = UIEdgeInsetsMake(titleIntrinsicContentSizeH + spacing, 0, 0, - titleIntrinsicContentSizeW);btn.titleEdgeInsets = UIEdgeInsetsMake(0, - imageW, imageH + spacing, 0);}else{CGFloat imageW = btn.imageView.image.size.width;CGFloat titleW = btn.titleLabel.frame.size.width;if (btn.contentHorizontalAlignment == UIControlContentHorizontalAlignmentLeft) {btn.imageEdgeInsets = UIEdgeInsetsMake(0, titleW + spacing, 0, 0);btn.titleEdgeInsets = UIEdgeInsetsMake(0, - imageW, 0, 0);} else if (btn.contentHorizontalAlignment == UIControlContentHorizontalAlignmentRight) {btn.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, - titleW);btn.titleEdgeInsets = UIEdgeInsetsMake(0, 0, 0, imageW + spacing);} else {CGFloat imageOffset = titleW + 0.5 * spacing;CGFloat titleOffset = imageW + 0.5 * spacing;btn.imageEdgeInsets = UIEdgeInsetsMake(0, imageOffset, 0, - imageOffset);btn.titleEdgeInsets = UIEdgeInsetsMake(0, - titleOffset, 0, titleOffset);}}
}//调用代码[self setBtnImageAndTitle:redbBtn WithStyle:@"right" Spacing:10];