IOS圖片拉伸的幾種方式

在iOS開發工作中，其實圖片拉伸還是很常用的，特別是在UI不給力的情況下，那麼下面根據以往的工作經驗，現在總結了一下最新且常用的兩種拉伸方法。
關鍵字：Show Overview、Slicing、Slice、resize、stretch

拉伸前：(假如給一個button設置一個背景圖片)

[self.myButton setBackgroundImage:[UIImage imageNamed:@"004"] forState:UIControlStateNormal];

效果如下：（四周很模糊，明顯給用戶很渣渣的感覺）

拉伸前效果

第一種：代碼拉伸，封裝到了一個分類裏，直接調用即可:

封裝的分類方法：

/**
 *  返回一張可以隨意拉伸不變形的圖片
 *  @param name 圖片名字
 */
+(UIImage *)stretchableImageWithImgae:(NSString *)name{

    UIImage *normal = [UIImage imageNamed:name];
    CGFloat w = normal.size.width * 0.5;
    CGFloat h = normal.size.height * 0.5;
    return [normal stretchableImageWithLeftCapWidth:w topCapHeight:h];
}

執行拉伸代碼：

 UIImage *image =   [UIImage  stretchableImageWithImgae:@"004"];
[self.myButton setBackgroundImage:image forState:UIControlStateNormal];

拉伸效果圖如下：

拉伸完美效果

第一種補充：resize方法（-resizableImageWithCapInsets）
該方法和第一種基本類似，但是這裏不方便的地方就是預留的部分不好把握，因爲要拉伸的圖片大小不可控，不推薦使用，但是在這裏也介紹一下。

  UIImage *image = [UIImage imageNamed:@"004"];

    CGFloat top = 10;     // 頂端預留部分
    CGFloat bottom = 10 ; // 底端預留部分
    CGFloat left = 40; // 左端預留部分
    CGFloat right = 40; // 右端預留部分
    UIEdgeInsets insets = UIEdgeInsetsMake(top, left, bottom, right);

    ///注意：拉伸之後一定要賦值回去
    image = [image resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];

    //UIImageResizingModeStretch：`拉伸`模式，通過`拉伸`Insets指定的矩形區域來填充圖片
    //UIImageResizingModeTile：`平鋪`模式，通過`重複顯示`Insets指定的矩形區域來填充圖片
    [self.myButton setBackgroundImage:image forState:UIControlStateNormal];

第二種：點擊圖片直接使用切片拉伸:

進入Assets.xcassets -> 選中圖片

兩種開始方式

拉伸方式選擇

水平拉伸

垂直拉伸

拉伸的幾種拉伸方式選擇

拉伸切片模式

執行代碼：代碼裏和平常一樣

 UIImage *image = [UIImage imageNamed:@"004"];
 [self.myButton setBackgroundImage:image forState:UIControlStateNormal];

完美拉伸效果

第二種補充：平鋪效果

平鋪效果測試

平鋪效果成功

第二種補充：聊天氣泡效果

聊天氣泡測試

聊天氣泡效果成功展示

最後的兩個補充，代碼都是很正常的代碼：

 UIImage *image = [UIImage imageNamed:@"001"];
 [self.myButton setBackgroundImage:image forState:UIControlStateNormal];

怎麼樣，這個切片拉伸功能強大吧？也很方便吧？？推薦使用哦！