開發(fā)中常常遇到這種需求:

1513586561706213.png

• 文字在左，圖片在右
• 圖片在左，文字在右
• 圖片在上，文字在下
  最簡單，同時(shí)也是最笨的方法就是自己用兩個(gè)控件UILabel和UIImageView來實(shí)現(xiàn)。
  其實(shí)我們都知道，一個(gè)按鈕控件就可以搞定，因?yàn)榘粹o里本身可以同時(shí)設(shè)置圖片和文字，我們需要做的只是調(diào)整一下文字和圖片的位置。
  因?yàn)榘粹o默認(rèn)的是“圖片在左，文字在右”，所以下面我們只一步一步來實(shí)現(xiàn)“文字在左，圖片在右”和“圖片在上，文字在下”

圖片在左，文字在右

/* 獲取按鈕文字的寬度 獲取按鈕圖片和文字的間距 獲取圖片寬度 */
CGFloat    space = 5;// 圖片和文字的間距
NSString    * titleString = [NSString stringWithFormat:@"我是測試我是測"];
CGFloat    titleWidth = [titleString sizeWithAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:14]}].width;
UIImage    * btnImage = [UIImage imageNamed:@"outspread"];// 11*6
CGFloat    imageWidth = btnImage.size.width;

/*當(dāng)然，為了防止文字內(nèi)容過多，要做一點(diǎn)預(yù)防*/
CGFloat    btnWidth = 200;// 按鈕的寬度
if (titleWidth > btnWidth - imageWidth - space) {
    titleWidth = btnWidth- imageWidth - space;
}

創(chuàng)建按鈕
UIButton   * testButton = [[UIButton alloc] initWithFrame:CGRectMake(10, 100, btnWidth, 40)];
testButton.titleLabel.font = [UIFont systemFontOfSize:14];
[testButton setBackgroundColor:[UIColor greenColor]];
[testButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
[testButton setTitle:titleString forState:UIControlStateNormal];
[testButton setImage:btnImage forState:UIControlStateNormal];
[self.view addSubview:testButton];

按鈕本身默認(rèn)的是：圖片在左，文字在右。并且文字和圖片的邊緣是UIEdgeInsetsZero。
默認(rèn)效果是：

1513586803832475.png

文字在左，圖片在右：

那么，想實(shí)現(xiàn)文字在左，圖片在右，就需要文字向左邊調(diào)整，圖片向右邊調(diào)整

1.按鈕文字向左邊調(diào)整，就需要按鈕文字左邊擴(kuò)展，右邊收縮 按鈕文字向左邊擴(kuò)展，即left方向需要擴(kuò)展圖片的寬度+間距0.5； 按鈕文字向右邊需要收縮，即right方向需要收縮圖片的寬度+間距0.5；

2.按鈕圖片向右邊調(diào)整，就需要按鈕圖片右邊擴(kuò)展，左邊收縮 按鈕圖片向右邊擴(kuò)展，即right方向需要擴(kuò)展文字的寬度+間距0.5； 按鈕圖片向左邊收縮，即left方向需要搜索文字的寬度+間距0.5

PS:擴(kuò)展就是設(shè)置負(fù)值。收縮就是設(shè)置正值

[testButton setTitleEdgeInsets:UIEdgeInsetsMake(0, -(imageWidth+space*0.5), 0, (imageWidth+space*0.5))];
[testButton setImageEdgeInsets:UIEdgeInsetsMake(0, (titleWidth + space*0.5), 0, -(titleWidth + space*0.5))];

1513586842460908.png

圖片在上，文字在下：

**需要先獲取圖片和文字的高度**
CGFloat    imageHeight = btnImage.size.height;
CGFloat    titleHeight = [titleString sizeWithAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:14]}].height;

如果要實(shí)現(xiàn)上下,比如圖片在上，文字在下：

圖片上移：頂部向上擴(kuò)展，底部收縮 因?yàn)楸旧砭褪谴怪本又械?，所以移?dòng)的距離是：imageHeight0.5 + space0.5

文字下移：頂部收縮，底部擴(kuò)展 移動(dòng)距離是：titleHeight0.5 + space0.5;

這樣做還不夠，因?yàn)槟J(rèn)圖片在左，文字在右。所以還要想辦法讓他們左右居中：

1.圖片左邊收縮，右邊擴(kuò)展 移動(dòng)的距離是：(titleWidth+imageWidth)0.5-imageWidth0.5 即 titleWidth*0.5;

2.文字左邊擴(kuò)展，右邊收縮 移動(dòng)的距離是：(titleWidth+imageWidth)0.5-titleWidth0.5 即 imageWidth*0.5;

[testButton setImageEdgeInsets:UIEdgeInsetsMake(-(imageHeight*0.5 + space*0.5), titleWidth*0.5, imageHeight*0.5 + space*0.5, -titleWidth*0.5)];
[testButton setTitleEdgeInsets:UIEdgeInsetsMake(titleHeight*0.5 + space*0.5, -imageWidth*0.5, -(titleHeight*0.5 + space*0.5), imageWidth*0.5)];

運(yùn)行效果：

1513586879938978.png

感謝：
http://www.cocoachina.com/ios/20171218/21574.html