• 示例
  在創(chuàng)建button的時(shí)候經(jīng)常需要在button上添加圖片和按鈕，而且一般情況下我們需要的都是圖片在上、標(biāo)題在下的效果（灰色的為button）：

屏幕快照 2016-04-08 下午4.38.33.png

而當(dāng)我們設(shè)置好title和image后發(fā)現(xiàn)是圖片居左，標(biāo)題居右的：

屏幕快照 2016-04-08 下午4.40.19.png

當(dāng)然這不是我們想要的效果，于是通過設(shè)置UIEdgeInsetsMake屬性來達(dá)到我們想要的效果，但具體是要設(shè)置多少，每次做的時(shí)候我總是在嘗試，一點(diǎn)一點(diǎn)的去試，直達(dá)到想要的效果，這樣做事非常讓人頭疼的，而且對原理什么的完全不清楚，更讓人頭疼的是萬一修改需求，例如字體的多少或者大小發(fā)生了變化，那么又要一頓狂試，瘋了的感覺，有木有！于是有一天（也就是今天）我終于受不了了，開始研究UIEdgeInsetsMake到底是個(gè)什么鬼東西。

• 先看定義

typedef struct UIEdgeInsets {
    CGFloat top, left, bottom, right;  // specify amount to inset (positive) for each of the edges. values can be negative to 'outset'
} UIEdgeInsets;

UIEdgeInsets實(shí)際就是一個(gè)結(jié)構(gòu)體（之前在這寫的是枚舉，感謝無刃之刃提出的錯(cuò)誤），UIEdgeInsetsMake(<#CGFloat top#>, <#CGFloat left#>, <#CGFloat bottom#>, <#CGFloat right#>)要設(shè)置的就是四個(gè)邊距，先看一張圖：

image_2.png

圖中，藍(lán)色標(biāo)識(shí)為可變區(qū)域， 綠色標(biāo)識(shí)為不變區(qū)域。UIEdgeInsets結(jié)構(gòu)體的屬性top與bottom為一對，用來指定縱向可變區(qū)域（黑色虛線矩形），left與right為一對，用來指定橫向可變區(qū)域(白色虛線矩形)。當(dāng)UIButton/UIImageView的size大于UIImage的size時(shí)，會(huì)調(diào)整圖片中可變區(qū)域大小以鋪滿整個(gè)控件,具體調(diào)整規(guī)則如下：
(1)控件寬度大于圖片寬度，拉伸白色虛線矩形
(2)控件高度大于圖片高度，拉伸黑色虛線矩形
(3)控制寬度小于圖片寬度時(shí)，橫向整體縮小(可變區(qū)與不變區(qū)比例不變)
(4)控制高度小于圖片高度時(shí)，縱向整體縮小(可變區(qū)與不變區(qū)比例不變)

上面的圖片和解釋來自于一葉博客，按照我的理解可以這樣解釋：top就是距離頂部的距離在默認(rèn)的基礎(chǔ)上又加上設(shè)置的距離，拿開頭的button來說，在button僅設(shè)置image的時(shí)候（如果同時(shí)設(shè)置了image和title效果又是不一樣的，下面會(huì)詳解，稍安勿躁），image默認(rèn)是居中的，相當(dāng)于進(jìn)行了這樣的設(shè)置：

[button setImageEdgeInsets:UIEdgeInsetsMake(0, 0, 0, 0)];

如果我們在這個(gè)時(shí)候設(shè)置了：

[button setImageEdgeInsets:UIEdgeInsetsMake(20, 0, 0, 0)];

就相當(dāng)于在圖片居中的基礎(chǔ)上，將圖片又下移了20，如果是-20則是在原有的基礎(chǔ)上向上移20，其他幾個(gè)參數(shù)同理，正數(shù)就是距相應(yīng)的邊的距離增加，負(fù)數(shù)就是距相應(yīng)的距離減少。關(guān)于這一點(diǎn)大家若想真正弄清楚，單純的去看我寫的或者其他任何一個(gè)人寫的文章搜幾乎是不可能的，最好的辦法就是去實(shí)踐，自己動(dòng)手寫一段代碼，一個(gè)變量一個(gè)變量的去試驗(yàn)，每改變一個(gè)變量的值會(huì)出現(xiàn)什么樣的效果，這樣才能理解的更加透徹。在這之前我在網(wǎng)上搜了很多這方面的資料，大都是一個(gè)人寫的，被別人拿去粘貼復(fù)制，千篇一律，或許不是別人講的不透徹，只是自己缺少實(shí)踐而已。扯遠(yuǎn)了，回到主題，接下來說一下同時(shí)設(shè)置圖片和標(biāo)題的情況:

• 為button同時(shí)設(shè)置圖片和標(biāo)題
  文章開頭就說了，當(dāng)我們給button設(shè)置圖片和title的時(shí)候默認(rèn)是圖片居左，標(biāo)題距右并排排列的：

    [button setImage:[UIImage imageNamed:@"ffw_32"] forState:UIControlStateNormal];
    [button setTitle:@"按鈕" forState:UIControlStateNormal];

我們回到文章開頭的第二章圖片，發(fā)生這樣變化的根源是什么呢？那就是當(dāng)我們同時(shí)添加圖片和標(biāo)題時(shí)，圖片默認(rèn)會(huì)向左偏移button的titleLabel的寬度，而標(biāo)題會(huì)向右偏移圖片的寬度，既然如此，我們就可以設(shè)置偏移量來達(dá)到我們想要的任何效果，一步一步來，先居中（大家可以先想一下這幾個(gè)參數(shù)應(yīng)該怎么設(shè)置）：

    [button setImageEdgeInsets:UIEdgeInsetsMake(0, 0, 0, -button.titleLabel.intrinsicContentSize.width)];
    [button setTitleEdgeInsets:UIEdgeInsetsMake(0, -button.currentImage.size.width, 0, 0)];

效果：

屏幕快照 2016-04-08 下午5.45.58.png

    [button setImageEdgeInsets:UIEdgeInsetsMake(-button.titleLabel.intrinsicContentSize.height, 0, 0, -button.titleLabel.intrinsicContentSize.width)];
    [button setTitleEdgeInsets:UIEdgeInsetsMake(button.currentImage.size.height, -button.currentImage.size.width, 0, 0)];

效果：

屏幕快照 2016-04-08 下午5.55.24.png

圖片和標(biāo)題好像有點(diǎn)近，好辦，再加一點(diǎn)：

[button setTitleEdgeInsets:UIEdgeInsetsMake(button.currentImage.size.height + 20, -button.currentImage.size.width, 0, 0)];

分開了：

屏幕快照 2016-04-08 下午5.57.56.png

附上我的測試demo,有需要的可以直接修改參數(shù)：

    UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 160, 160)];
    [button setImage:[UIImage imageNamed:@"ffw_32"] forState:UIControlStateNormal];
    [button setTitle:@"按鈕" forState:UIControlStateNormal];
    button.titleLabel.font = [UIFont systemFontOfSize:14];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    button.center = self.view.center;
    button.backgroundColor = [UIColor grayColor];
    [self.view addSubview:button];
    NSLog(@"%f",-button.titleLabel.bounds.size.width);
    
    [button setImageEdgeInsets:UIEdgeInsetsMake(-button.titleLabel.intrinsicContentSize.height, 0, 0, -button.titleLabel.intrinsicContentSize.width)];
    [button setTitleEdgeInsets:UIEdgeInsetsMake(button.currentImage.size.height + 20, -button.currentImage.size.width, 0, 0)];

• 后記
  作為iOS新人，我在找這方面的資料時(shí)著實(shí)費(fèi)了不少勁，希望這篇文章能幫助同我一樣迷茫的盆友，另外非常感謝一葉博客和Learning Notes的文章，受益匪淺！

• 參考：
  1、一葉博客
  2、Learning Notes

• End