iOS 圖片拉伸’S 二三事

今天咱們講述的是圖片相關問題。而在開發中總會遇到圖片拉伸問題。通常狀況下會有以下的處理方式：
1.因爲加載的圖片是網絡圖片，咱們通常都會去改變的是UIImageView的contentMode屬性。而且也提供了好多種顯示模式，咱們能夠根據相關的需求，調整不一樣的電視模式。

typedef NS_ENUM(NSInteger, UIViewContentMode) {
    UIViewContentModeScaleToFill,         // 默認 拉伸（會變形）
    UIViewContentModeScaleAspectFit,      // 等比例拉伸
    UIViewContentModeScaleAspectFill,     // 等比例填充
    UIViewContentModeRedraw,              // redraw on bounds change (這個不清楚) 
    UIViewContentModeCenter,              // 下面的就是不拉伸按位置顯示了
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
};
複製代碼

2.圖片的四個角不拉伸，讓中間的區域去拉伸。在開發中，作聊氣泡的時候用到的比較多。這樣的問題有兩種方法。 第一種

// 按4邊間距顯示不拉伸的區域
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets NS_AVAILABLE_IOS(5_0); 
複製代碼

這個方法的使用網上能夠找到不少。這裏就很少敘述。
第二種，本地圖片咱們都放在項目中的Assets.xcassets中，咱們點擊想要拉伸的圖片，而後點擊右下角的Show Slicing按鈕

點擊那個選擇框，會有以下選項

None
Horizonta
Vertical
Horizonta and Vertical
複製代碼

咱們是作聊天氣泡的 因此我就選擇了Horizonta and Vertical
可是今天主要的不是上面哪兩種拉伸狀況，如今出現了第三種那就是中間部分不拉伸，兩邊的部分拉伸就好了。

就像是這樣的，中間凹陷 的部分不能由於拉伸而變形，一開始咱們想的是由於iOS這邊的機型比較固定，能夠根據機型的判斷來調取不一樣尺寸的圖片，可是這樣的弊端就是 若是之後除了一種如今並不存在的機型，那麼就要發版本。這樣不是很靈活。因此我就上網找了好多的辦法，看看有沒有中間不拉伸兩邊拉伸的方案。 雖然沒有一步到位的方案，可是也找到了解決辦法，那就是退圖片作二次拉伸，從而達到俺想要的效果。廢話不錯說，直接上代碼

- (UIImage *)doubleStretchLeftAndRightWithContainerSize:(CGSize)size image:(UIImage *)oraimage
{
    CGSize imageSize = oraimage.size;
    CGSize bgSize = size;
    
    //1.第一次拉伸右邊 保護左邊
    UIImage *image = [oraimage stretchableImageWithLeftCapWidth:imageSize.width -1 topCapHeight:0];
    
    //第一次拉伸的距離以後圖片總寬度
    CGFloat tempWidth = (bgSize.width)/2 + imageSize.width/2;
    
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(tempWidth, imageSize.height), NO, [UIScreen mainScreen].scale);
    
    [image drawInRect:CGRectMake(0, 0, tempWidth, bgSize.height)];
    
    //拿到拉伸過的圖片
    UIImage *firstStrechImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    
    //2.第二次拉伸左邊 保護右邊
    UIImage *secondStrechImage = [firstStrechImage stretchableImageWithLeftCapWidth:firstStrechImage.size.width *0.2 topCapHeight:0];
    
    return secondStrechImage;
}
複製代碼

通過測試，這樣就能夠解決中間凹陷部分不變形的問題了