iOS开发image背景图片拉伸问题解决分析_苹果IOS

前言

（如果是imageview的图片拉伸问题，可直接看文章结尾，oc和swift）

在开发中聊天、按钮等背景图片，ui设计师可以仅设计其边框样式，然后通过代码就行处理，以适应聊天文字的大小或按钮的大小。

这样不仅可以使安装包更轻巧而且可以更灵活的使用图片；

方法一：

即将弃用方法这个函数是uiimage的一个实例函数，它的功能是创建一个内容可拉伸，而边角不拉伸的图片，需要两个参数，第一个是左边不拉伸区域的宽度，第二个参数是上面不拉伸的高度。

根据设置的宽度和高度，将接下来的一个像素进行左右扩展和上下拉伸。

- (uiimage *)stretchableimagewithleftcapwidth:(nsinteger)leftcapwidth topcapheight:(nsinteger)topcapheight;

注意：可拉伸的范围都是距离leftcapwidth后的1竖排像素，和距离topcapheight后的1横排像素。

   uiimage *image = [uiimage imagenamed:@"圆角矩形-7-拷贝"];
    //原始图片样式添加
    self.originalimageview.image = image;
    //没处理好的图片
    self.badimageview.image = image;
//图片处理后的 将被弃用 方法一：
//这个函数是uiimage的一个实例函数，它的功能是创建一个内容可拉伸，而边角不拉伸的图片，需要两个参数，第一个是左边不拉伸区域的宽度，第二个参数是上面不拉伸的高度。
//根据设置的宽度和高度，将接下来的一个像素进行左右扩展和上下拉伸。
    [self.textimageview setimage:[image stretchableimagewithleftcapwidth:image.size.width*0.5 topcapheight:image.size.height*0.5]];
//注意：可拉伸的范围都是距离leftcapwidth后的1竖排像素，和距离topcapheight后的1横排像素。

图片讲解

可拉伸的范围都是距离leftcapwidth后的1竖排像素，和距离topcapheight后的1横排像素。

方法二：

ios 5 推出

- (uiimage *)resizableimagewithcapinsets:(uiedgeinsets)capinsets; 
// create a resizable version of this image. the interior is tiled when drawn.

   uiimage *image = [uiimage imagenamed:@"圆角矩形-7-拷贝"];
    //原始图片样式添加
    self.originalimageview.image = image;
    //没处理好的图片
    self.badimageview.image = image;
//处理图片 ios 5 方法三：
            cgfloat width = image.size.width;
            cgfloat height = image.size.height;
            cgfloat top = height/2.0f - 0.5f; // 顶端盖高度
            cgfloat bottom = height/2.0f - 0.5f ; // 底端盖高度
            cgfloat left = width/2.0f - 0.5f; // 左端盖宽度
            cgfloat right = width/2.0f - 0.5f; // 右端盖宽度
            uiedgeinsets insets = uiedgeinsetsmake(top, left, bottom, right);
            //创建 一个可变的image版本，内部平铺，类：uiimageresizingmodetile模式；
            self.textimageview.image = [image resizableimagewithcapinsets:insets];

图片讲解

中间的框框是复制平铺区域，在本工程中为2px大小，cap部分（即线的区域）为保留样式

方法三：

ios 6 方法

- (uiimage *)resizableimagewithcapinsets:(uiedgeinsets)capinsets resizingmode:(uiimageresizingmode)resizingmode;
 // the interior is resized according to the resizingmode

   uiimage *image = [uiimage imagenamed:@"圆角矩形-7-拷贝"];
    //原始图片样式添加
    self.originalimageview.image = image;
    //没处理好的图片
    self.badimageview.image = image;
            //处理图片 ios 6 方法二：
            cgfloat width = image.size.width;
            cgfloat height = image.size.height;
            cgfloat top = height/2.0f - 0.5f; // 顶端盖高度
            cgfloat bottom = height/2.0f - 0.5f ; // 底端盖高度
            cgfloat left = width/2.0f - 0.5f; // 左端盖宽度
            cgfloat right = width/2.0f - 0.5f; // 右端盖宽度
            uiedgeinsets insets = uiedgeinsetsmake(top, left, bottom, right);
            // 指定为拉伸模式，伸缩后重新赋值
            //uiimageresizingmodestretch：拉伸模式，通过拉伸uiedgeinsets指定的矩形区域来填充图片
            //uiimageresizingmodetile：平铺模式，通过重复显示uiedgeinsets指定的矩形区域来填充图片
            _textimageview.image = [image resizableimagewithcapinsets:insets resizingmode:uiimageresizingmodetile];
// swift
let image = uiimage(named: "rounded_rectangle_7_copy")
if image != nil {  
    self.originalimageview.image = image  
    self.badimageview.image = image  
} else {  
    self.originalimageview.image = image  
    self.badimageview.image = image  
}
let width = image?.size.width ?? 0  
let height = image?.size.height ?? 0
let top = height / 2 - 0.5  
let bottom = height / 2 - 0.5  
let left = width / 2 - 0.5  
let right = width / 2 - 0.5
let insets = uiedgeinsets(top: top, left: left, bottom: bottom, right: right)
if image != nil {  
    let resizingmode = uiimage.resizableimageresizingmode.tile  
    self.textimageview.image = uiimage(resizableimagewithcapinsets: insets, resizingmode: resizingmode)  
} else {  
    self.textimageview.image = uiimage(resizableimagewithcapinsets: insets, resizingmode: resizingmode)  
}

补充知识

关于imageview的图片拉伸问题，在这里稍作总结，希望可以给你提供帮助。

typedef ns_enum(nsinteger, uiviewcontentmode) {
    uiviewcontentmodescaletofill,
    uiviewcontentmodescaleaspectfit,      
// contents scaled to fit with fixed aspect. remainder is transparent
    uiviewcontentmodescaleaspectfill,    
 // contents scaled to fill with fixed aspect. some portion of content may be clipped.
    uiviewcontentmoderedraw,             
 // redraw on bounds change (calls -setneedsdisplay)
    uiviewcontentmodecenter,             
 // contents remain same size. positioned adjusted.
    uiviewcontentmodetop,
    uiviewcontentmodebottom,
    uiviewcontentmodeleft,
    uiviewcontentmoderight,
    uiviewcontentmodetopleft,
    uiviewcontentmodetopright,
    uiviewcontentmodebottomleft,
    uiviewcontentmodebottomright,
};

//使用方法
[imageview setcontentmode:uiviewcontentmodescaleaspectfit];
//or
imageview.contentmode = uiviewcontentmodescaleaspectfit;
//以下方法，图片保持原有大小比例的情况下，展示在imageview的上下左右等位置；如果视图大小小于图片的尺寸，则图片会超出视图边界；
    uiviewcontentmodetop,
    uiviewcontentmodebottom,
    uiviewcontentmodeleft,
    uiviewcontentmoderight,
    uiviewcontentmodetopleft,
    uiviewcontentmodetopright,
    uiviewcontentmodebottomleft,
    uiviewcontentmodebottomright,
    uiviewcontentmodecenter,  
    uiviewcontentmodescaletofill,  //根据视图的比例去拉伸图片内容。图片可能变形；
    uiviewcontentmodescaleaspectfit,  //保持图片内容的纵横比例，来适应视图的大小。
    uiviewcontentmodescaleaspectfill,   //用图片内容来填充视图的大小，多余得部分可以被修剪掉来填充整个视图边界。 
    uiviewcontentmoderedraw,     //这个选项是单视图的尺寸位置发生变化的时候通过调用setneedsdisplay方法来重新显示。

以上就是ios开发image背景图片拉伸问题解决分析的详细内容，更多关于ios image背景图片拉伸的资料请关注代码网其它相关文章！