扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
在 iOS 开发过程中，对图片的处理不仅仅局限于显示、渲染样式，还常常遇到对view指定区域截图，以及对图片的压缩、拉伸等操作。下面我们介绍一下类似的操作过程：
创新互联是网站建设技术企业，为成都企业提供专业的网站设计、做网站，网站设计，网站制作，网站改版等技术服务。拥有10余年丰富建站经验和众多成功案例，为您定制适合企业的网站。10余年品质，值得信赖！
注：通过 UIGraphicsBeginImageContextWithOptions(CGSize size, BOOL opaque, CGFloat scale) 和 drawViewHierarchyInRect 的配合来截取并渲染出来的图片位置和大小，是由前者的size和后者的rect共同决定的。 即，画布相当于父view，其尺寸为size，截图绘制到画布中的位置和尺寸为rect。
想试一试的同学，可以创建一个demo，取不同的size和rect值，来观察画布和截图的位置。也可以试着将画布和截图完全吻合，即将截图完整的渲染出来，这并不难。
裁剪图片就是对当前的图片按照指定的大小范围生成一个新的图片。需要注意的是如果当前显示图片是2倍图或者3倍图，要么可能尺寸不对，要么截出来的图片很模糊，因此，需要在截图前调整rect值。
注：UIImageJPEGRepresentation 两个参数：图片引用 和压缩系数，而 UIImagePNGRepresentation 只需图片引用作为参数。在实际使用过程中，UIImagePNGRepresentation(UIImage* image) 一般要比UIImageJPEGRepresentation(UIImage* image, 1.0) 返回的图片数据量大，在处理图片时，若对图片质量要求不高，则建议使用UIImageJPEGRepresentation，根据自己的实际使用场景设置压缩系数，进一步降低图片数据量大小。
在 = iOS 5.0 时，UIImage的新方法可以处理图片的拉伸问题：
使用过程：
在 = iOS 6.0 时，UIImage的新方法可以处理图片的拉伸问题：
使用过程：
参考文章：
stretchableImageWithLeftCapWidth通常用来做图片的局部拉伸，常用的例子是聊天的背景图的部分拉伸
stretchableImageWithLeftCapWidth这个方法 有2个参数
leftCapWidth: 左边不拉伸的像素
topCapHeight:上边不拉伸的像素
参数的意义是，参数指定30，30。那么，图片左边30个像素，上边30个像素。不会被拉伸，x坐标为31的一个像素会被横向复制，y坐标为31的一个像素会被纵向复制。
注意：只是对一个像素进行复制到一定宽度。而图像后面的剩余像素也不会被拉伸。类试下面的图片（该图片来自网图）。
另外分享Xcode中Slicing， Xcode图片素材Slicing处理 ，同样也能实现图片的局部拉伸。
1/7
首先，打开手机里的照片合集
2/7
然后选中自己想要裁剪的图片，打开它
3/7
轻点图片，右上角有一个“编辑”，选中他
4/7
在编辑界面里，左下角有一个“裁剪”的标志，已经用红色线给大家圈出来了，看下边的图片提示哦
5/7
用手按照左下角或者是右下角往上滑动，直到自己满意的位置暂停即可
6/7
完事后，点击完成即可，然后成品就出来啦
7/7
对比图给大家了，大家可以看下哦！
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"bgImage"]];
创建并设置默认图, 也可以
UIImageView*imageView = [[UIImageView alloc] init];
imageView.image= [UIImageimageNamed:@"bgImage"];
还可以这样先设置imageview的大, 在设置图片
UIImageView*imageView = [[UIImageView alloc] initWithFrame:(CGRectMake(0,144,SCREEN_Width,50))];
imageView.image= [UIImageimageNamed:@"bgImage"];
由此可看imageview的frame可以这样设置
imageView.frame=CGRectMake(0,144,SCREEN_Width,50);
通常我们使用的的imageview都会添加圆角边框
imageView.layer.masksToBounds = YES;
imageView.layer.cornerRadius=25;
imageView.layer.borderColor = [UIColor blueColor].CGColor;
imageView.layer.borderWidth=1;
这个圆角和边框像view和label以及button的设置方式都是一样的 当然imageview也一样
imageView.backgroundColor= [UIColorclearColor]; 图片设置背景颜色, 我通常使用clearColor 透明
imageView.userInteractionEnabled = YES; 图片设置成可交互, 设置为NO则不能交互
[self.viewaddSubview: imageView]; 添加视图也可叫做显示视图
设置图片内容的布局方式 imageView.contentMode
这个属性是用来设置图片的显示方式，如居中、居右，是否缩放等
imageView.contentMode = UIViewContentModeScaleAspectFit;
UIViewContentMode contentMode枚举类型
(1) UIViewContentModeScaleToFill; 默认，对图片进行拉伸处理（不是按比例），是充满bouns
(2) UIViewContentModeScaleAspectFit; 按原图比例进行拉伸，是图片完全展示在bouns中
(3) UIViewContentModeScaleAspectFill; 按原图比例填充，使图片展示在bouns中，可能只显示部分
(4) UIViewContentModeRedraw; 重划边界变化(重设 - setNeedsDisplay)
(5) UIViewContentModeCenter; 图片显示在imageview的正中间，原图大小
(6) UIViewContentModeTop; 图片显示在imageview的上部，原图大小
(7) UIViewContentModeBottom; 图片显示在imageview的下部，原图大小
(8) UIViewContentModeLeft; 图片显示在imageview的左部，原图大小
(9) UIViewContentModeRight; 图片显示在imageview的右部，原图大小
(10) UIViewContentModeTopLeft; 图片显示在imageview的左上部，原图大小
(11) UIViewContentModeTopRight; 图片显示在imageview的右上部，原图大小
(12) UIViewContentModeBottomLeft; 图片显示在imageview的左下部，原图大小
(13) UIViewContentModeBottomRight; 图片显示在imageview的右下部，原图大小
imageView.alpha = 1.0; 设置图片透明度
NSString *path1 = [[NSBundle mainBundle] pathForResource:@"1" ofType:@"jpg"];
NSString *path2 = [[NSBundle mainBundle] pathForResource:@"2" ofType:@"jpg"];
NSString *path3 = [[NSBundle mainBundle] pathForResource:@"3" ofType:@"jpg"];
imageView.animationImages = @[[UIImage imageWithContentsOfFile:path1],[UIImage imageWithContentsOfFile:path2],[UIImage imageWithContentsOfFile:path3]];
imageView.animationDuration = 5.0f; 设置循环一次的时间
imageView.animationRepeatCount = 0; // 设置循环次数（0为无线循环）
[imageView startAnimating]; // 开始动画
[imageView stopAnimating]; // 停止动画
NSData *imageData = [NSData dataWithContentsOfFile:path];
UIImage *image4 = [UIImage imageWithData:imageData];
NSString *path = [[NSBundle mainBundle] pathForResource:@"1" ofType:@"jpg"];
UIImage *image2 = [UIImage imageWithContentsOfFile:path];
ImageView.hidden = NO; 隐藏或者显示图片 YES为隐藏
[ImageView sizeToFit]; 将图片尺寸调整为与内容图片相同
UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapImageView:)]; // 设置手势
[ImageView addGestureRecognizer:singleTap]; // 给图片添加手势
图片拉伸API分析
– (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets resizingMode:(UIImageResizingMode)resizingMode NS_AVAILABLE_IOS(6_0);
UIEdgeInsets，可以通过设置UIEdgeInsets的left、right、top、bottom来分别指定左端盖宽度、右端盖宽度、顶端盖高度、底端盖高度。
UIImageResizingMode枚举:
UIImageResizingModeStretch：拉伸模式，通过拉伸UIEdgeInsets指定的矩形区域来填充图片。
UIImageResizingModeTile：平铺模式，通过重复显示UIEdgeInsets指定的矩形区域来填充图片。
[separatorLineView setFrame:CGRectMake(10, 0, 430, 3)];
separatorLineView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"divider.png"]];
在 iPad 上，它显示像这样：
在 iPhone，它工作正常。
IPhone 的代码如下所示：
[separatorLineView setFrame:CGRectMake(10, 0, 180, 3)];
separatorLineView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"divider.png"]];
如何避免重复？必须使用 resizableImageWithCapInsets 吗？
需要一些指导和建议。
解决方法 1:
添加下面的方法
-(UIImage *)imageResize :(UIImage*)img andResizeTo:(CGSize)newSize
{
CGFloat scale = [[UIScreen mainScreen]scale];
//UIGraphicsBeginImageContext(newSize);
UIGraphicsBeginImageContextWithOptions(newSize, NO, scale);
[img drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
现在改变你的代码
[separatorLineView setFrame:CGRectMake(10, 0, 180, 3)];
separatorLineView.backgroundColor = [UIColor colorWithPatternImage:[self imageResize :[UIImage imageNamed:@"divider.png"] andResizeTo:separatorLineView.frame.size]];
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网