#import <UIKit/UIKit.h>
// 定義一個(gè)枚舉（包含了四種類型的button）
typedef NS_ENUM(NSUInteger, MKButtonEdgeInsetsStyle) {
  MKButtonEdgeInsetsStyleTop, // image在上，label在下
  MKButtonEdgeInsetsStyleLeft, // image在左，label在右
  MKButtonEdgeInsetsStyleBottom, // image在下，label在上
  MKButtonEdgeInsetsStyleRight // image在右，label在左
};

@interface UIButton (ImageTitleSpacing)

/**
 * 設(shè)置button的titleLabel和imageView的布局樣式，及間距
 *
 * @param style titleLabel和imageView的布局樣式
 * @param space titleLabel和imageView的間距
 */
- (void)layoutButtonWithEdgeInsetsStyle:(MKButtonEdgeInsetsStyle)style
            imageTitleSpace:(CGFloat)space;

@end

#import "UIButton+ImageTitleSpacing.h"

@implementation UIButton (ImageTitleSpacing)

- (void)layoutButtonWithEdgeInsetsStyle:(MKButtonEdgeInsetsStyle)style
            imageTitleSpace:(CGFloat)space {
  /**
   * 知識(shí)點(diǎn)：titleEdgeInsets是title相對(duì)于其上下左右的inset，跟tableView的contentInset是類似的，
   * 如果只有title，那它上下左右都是相對(duì)于button的，image也是一樣；
   * 如果同時(shí)有image和label，那這時(shí)候image的上左下是相對(duì)于button，右邊是相對(duì)于label的；title的上右下是相對(duì)于button，左邊是相對(duì)于image的。
   */

  // 1. 得到imageView和titleLabel的寬、高
  CGFloat imageWith = self.imageView.frame.size.width;
  CGFloat imageHeight = self.imageView.frame.size.height;

  CGFloat labelWidth = 0.0;
  CGFloat labelHeight = 0.0;
  if ([UIDevice currentDevice].systemVersion.floatValue >= 8.0) {
    // 由于iOS8中titleLabel的size為0，用下面的這種設(shè)置
    labelWidth = self.titleLabel.intrinsicContentSize.width;
    labelHeight = self.titleLabel.intrinsicContentSize.height;
  } else {
    labelWidth = self.titleLabel.frame.size.width;
    labelHeight = self.titleLabel.frame.size.height;
  }

  // 2. 聲明全局的imageEdgeInsets和labelEdgeInsets
  UIEdgeInsets imageEdgeInsets = UIEdgeInsetsZero;
  UIEdgeInsets labelEdgeInsets = UIEdgeInsetsZero;

  // 3. 根據(jù)style和space得到imageEdgeInsets和labelEdgeInsets的值
   /**
    MKButtonEdgeInsetsStyleTop, // image在上，label在下
    MKButtonEdgeInsetsStyleLeft, // image在左，label在右
    MKButtonEdgeInsetsStyleBottom, // image在下，label在上
    MKButtonEdgeInsetsStyleRight // image在右，label在左
   */
  switch (style) {
    case MKButtonEdgeInsetsStyleTop:
    {
      imageEdgeInsets = UIEdgeInsetsMake(-labelHeight-space/2.0, 0, 0, -labelWidth);
      labelEdgeInsets = UIEdgeInsetsMake(0, -imageWith, -imageHeight-space/2.0, 0);
    }
      break;
    case MKButtonEdgeInsetsStyleLeft:
    {
      imageEdgeInsets = UIEdgeInsetsMake(0, -space/2.0, 0, space/2.0);
      labelEdgeInsets = UIEdgeInsetsMake(0, space/2.0, 0, -space/2.0);
    }
      break;
    case MKButtonEdgeInsetsStyleBottom:
    {
      imageEdgeInsets = UIEdgeInsetsMake(0, 0, -labelHeight-space/2.0, -labelWidth);
      labelEdgeInsets = UIEdgeInsetsMake(-imageHeight-space/2.0, -imageWith, 0, 0);
    }
      break;
    case MKButtonEdgeInsetsStyleRight:
    {
      imageEdgeInsets = UIEdgeInsetsMake(0, labelWidth+space/2.0, 0, -labelWidth-space/2.0);
      labelEdgeInsets = UIEdgeInsetsMake(0, -imageWith-space/2.0, 0, imageWith+space/2.0);
    }
      break;
    default:
      break;
  }

  // 4. 賦值
  self.titleEdgeInsets = labelEdgeInsets;
  self.imageEdgeInsets = imageEdgeInsets;
}

@end

// 導(dǎo)入頭文件
#import "UIButton+ImageTitleSpacing.h"
// 我們隨意創(chuàng)建一個(gè)按鈕比如button，在設(shè)置完按鈕的圖片、標(biāo)題和frame后，只需要加上如下代碼：
[button layoutButtonWithEdgeInsetsStyle: 這里填樣式 imageTitleSpace: 這里填寫圖片和文字的間距];

#import "TSSquareButton.h"

@implementation TSSquareButton

- (instancetype)initWithFrame:(CGRect)frame {
  if (self = [super initWithFrame:frame]) {
    // 設(shè)置圖片的其他屬性
    self.titleLabel.textAlignment = NSTextAlignmentCenter;
    self.titleLabel.font = [UIFont systemFontOfSize:12.0];
    [self setBackgroundColor:[UIColor whiteColor]];
    [self setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
  }
  return self;
}

// 重寫layoutSubviews方法，手動(dòng)設(shè)置按鈕子控件的位置
- (void)layoutSubviews {
  [super layoutSubviews];

  self.imageView.TS_width = self.TS_width * 0.4;
  self.imageView.TS_height = self.imageView.TS_width;
  self.imageView.TS_y = self.TS_height * 0.25;
  self.imageView.TS_centerX = self.TS_width * 0.5;

  self.titleLabel.TS_width = self.TS_width;
  self.titleLabel.TS_y = self.imageView.TS_buttom ;
  self.titleLabel.TS_height = 25;
  self.titleLabel.TS_x = 0;
}

@end