欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

iOS图片压缩、滤镜、剪切及渲染等详解

程序员文章站 2022-10-15 18:26:32
前言 本文主要给大家介绍了关于ios图片压缩、滤镜、剪切及渲染的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧 主要内容: 1、图片基础知识...

前言

本文主要给大家介绍了关于ios图片压缩、滤镜、剪切及渲染的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧

主要内容:

1、图片基础知识的介绍

2、图片压缩

  • 简单的回顾一下从相册获取一张图片
  • 直接格式转换压缩:png、jpg、context 重新绘制

3、图片处理

  • 基于图片像素修改
  • 图片剪切clip
  • 渲染render
  • 截屏

一、图片基础知识的介绍

一张图像是像素点的集合,每一个像素都是一个独立,有自己的颜色。图像一般情况下都存储成数组,可以说是二维数组。当成百上千万个像素集合一起后,就构成了图像。表示图形的方式很多种yuv,rgba,最简单的:32位rgba模式。将一个颜色的值存储在32位中(或4个字节) 每个字节存储一个颜色通道(rgba)。

二、图片压缩

2.1、简单的回顾一下从相册获取一张图片

<1>、说到系统的图片,离不开相册与相机,要能使真机在使用时成功调用相册/拍照功能,那么我们需要在info.plist类里面设置两个key:privacy - camera usage description与privacy - photo library usage description,在测试的时候根据崩溃添加更好

iOS图片压缩、滤镜、剪切及渲染等详解
相机与相册的key

<2>、挂两个代理:<uiimagepickercontrollerdelegate,uinavigationcontrollerdelegate>

<3>、定义两个button,相册的tag值 101,相机102,调用uiimagepickercontroller

#pragma mark 选择相册
-(void)selectimage:(uibutton *)sender{

 nsinteger tag = sender.tag - 100;
 nsuinteger sourcetype = 0;

 if (tag == 1) {
 // 相册
 // 1.判断能否打开照片库(不支持直接返回)
 if(![uiimagepickercontroller issourcetypeavailable:uiimagepickercontrollersourcetypephotolibrary]) return;
 sourcetype = uiimagepickercontrollersourcetypephotolibrary;

 }else if (tag == 2){
 // 拍照
 // 2.判断支不支持相机(不支持直接返回)
 if(![uiimagepickercontroller issourcetypeavailable:uiimagepickercontrollersourcetypecamera]) return;
 sourcetype = uiimagepickercontrollersourcetypecamera;
 }

 uiimagepickercontroller *imagepickercontroller = [[uiimagepickercontroller alloc] init];
 //设置代理
 imagepickercontroller.delegate = self;
 // imagepickercontroller.allowsediting = yes;
 imagepickercontroller.sourcetype = sourcetype;

 [self presentviewcontroller:imagepickercontroller animated:yes completion:nil];
}

<4>、uiimagepickercontroller代理方法的实现(暂且去掉剪辑图片)

#pragma mark - uiimagepicker delegate
- (void)imagepickercontroller:(uiimagepickercontroller *)picker didfinishpickingmediawithinfo:(nsdictionary<nsstring *,id> *)info{

 nsstring *mediatype=[info objectforkey:uiimagepickercontrollermediatype];
 // 获取到的图片
 if ([mediatype isequaltostring:@"public.image"]) {
 uiimage * image;
 // 判断,图片是否允许修改
 // if ([picker allowsediting]){
  //获取用户编辑之后的图像
  // image = [info objectforkey:uiimagepickercontrollereditedimage];
 // } else {
  // 照片的元数据参数
  image = [info objectforkey:uiimagepickercontrolleroriginalimage];
 // }

 // 压缩图片(处理) 看下面
 }

 [self dismissviewcontrolleranimated:yes completion:null];
}

// 当用户取消选择的时候,调用该方法
- (void)imagepickercontrollerdidcancel:(uiimagepickercontroller *)picker{

 nslog(@"取消相册使用 --- %s", __func__);
 [self dismissviewcontrolleranimated:yes completion:nil];
}

<4>、 计算  nsdata 的大小

#pragma mark 计算 nsdata 的大小
- (nsstring*)length:(nsinteger)length{

 if (length > 1024 * 1024) {

 int mb = (int)length/(1024*1024);
 int kb = (length%(1024*1024))/1024;
 return [nsstring stringwithformat:@"%dmb%dkb",mb, kb];
 }else{

 return [nsstring stringwithformat:@"%ldkb",length/1024];
 }
}

2.2、在上面我们已经拿到图片了,那么下面我们队图片的压缩进行下处理

<1>:png 压缩

// 压缩图片
nsdata *datapng = uiimagepngrepresentation(image);
uiimage *compresspngimage = [uiimage imagewithdata:datapng];
nslog(@"%@",[self length:datapng.length]);

提示:

  • 这种压缩方式会出现内存飙升
  • 文件属性格式并不会压缩,压缩的是图片内容(像素)

<2>:jpg 压缩

/**
 第一个参数:uiimage 对象
 第二个参数:图片质量(压缩系数)0~1 之间
 */
nsdata *datajpg = uiimagejpegrepresentation(image, 0.1);
uiimage *compressjpgimage = [uiimage imagewithdata:datajpg];
nslog(@"%@",[self length:datajpg.length]);

提示:

1.如果是通过jpeg来压缩图片, 图片压缩之后是不保真的

2.苹果官方不推荐我们使用jpg图片,因为现实jpg图片的时候解压缩非常消耗性能

3.这种压缩方式虽然可以通过设置图片质量,但是也会出现内存飙升

<3>:自定义 size 压缩通过 上下文 来压缩图片

uiimage *compressimg = [self compressoriginalimage:image withimagesize:cgsizemake(200, 200)];
nslog(@"%@",nsstringfromcgsize(compressimg.size));
 
// 压缩图片
- (uiimage *)compressoriginalimage:(uiimage *)originalimage withimagesize:(cgsize)size{

 // 开启图片上下文
 uigraphicsbeginimagecontext(size);
 // 将图片渲染到图片上下文
 [originalimage drawinrect:cgrectmake(0, 0, size.width, size.height)];
 // 获取图片
 uiimage *newimage = uigraphicsgetimagefromcurrentimagecontext();
 // 关闭图片上下文
 uigraphicsendimagecontext();

 return newimage;
}

提示:这种方式解决了内存的飙升,算是一种好的压缩方式

<4>:注意:一般情况下,只要涉及到从相册中获取图片的功能, 都需要处理内存,一般情况下一个应用程序启动会占用20m左右的内存, 当内存飙升到500m左右的时候系统就会发送内存警告, 此时就需要释放内存 , 否则就会闪退,只要内存释放到100m左右, 那么系统就不会闪退我们的应用程序,也就是说一个应用程序占用的内存20~100时是比较安全的内容范围。

三、图片处理

3.1、基于图片像素修改

<1>、过滤图片:涉及到图片的像素处理,也是根据上下文进行操作的,进行一个绘制;从图片文件把 图片数据的像素拿出来(rgba), 对像素进行操作, 进行一个转换(bitmap (gpu))
修改完之后,还原(图片的属性 rgba,rgba (宽度,高度,色值空间,拿到宽度和高度,每一个画多少个像素,画多少行))

iOS图片压缩、滤镜、剪切及渲染等详解
过滤图片

-(void)filterimage{

 cgimageref imageref = self.imageview1.image.cgimage;
 // 1 个字节 = 8bit 每行有 17152 每行有17152*8 位
 size_t width = cgimagegetwidth(imageref);
 size_t height = cgimagegetheight(imageref);
 size_t bits = cgimagegetbitspercomponent(imageref); // 8
 size_t bitsperrow = cgimagegetbytesperrow(imageref); // width * bits

 // 颜色空间
 cgcolorspaceref colorspace = cgimagegetcolorspace(imageref);
 // alphainfo: rgba agbr rgb :alphainfo 信息
 cgimagealphainfo alpinfo = cgimagegetalphainfo(imageref);

 // bitmap的数据
 cgdataproviderref providerref = cgimagegetdataprovider(imageref);
 cfdataref bitmapdata = cgdataprovidercopydata(providerref);

 nsinteger pixlength = cfdatagetlength(bitmapdata);
 // 像素byte数组
 byte *pixbuf = cfdatagetmutablebyteptr((cfmutabledataref)bitmapdata);

 // rgba 为一个单元
 for (int i = 0; i < pixlength; i+=4) {

  [self eocimagefiletpixbuf:pixbuf offset:i];
 }

 // 准备绘制图片了
 // bitmap 生成一个上下文 再通过上下文生成图片
 cgcontextref contextr = cgbitmapcontextcreate(pixbuf, width, height, bits, bitsperrow, colorspace, alpinfo);

 cgimageref filterimageref = cgbitmapcontextcreateimage(contextr);

 uiimage *filterimage = [uiimage imagewithcgimage:filterimageref];

 self.imageview1.image = filterimage;
}

// rgba 为一个单元 彩色照变黑白照
- (void)eocimagefiletpixbuf:(byte*)pixbuf offset:(int)offset{

 int offsetr = offset;
 int offsetg = offset + 1;
 int offsetb = offset + 2;
 // int offseta = offset + 3;

 int red = pixbuf[offsetr];
 int gre = pixbuf[offsetg];
 int blu = pixbuf[offsetb];
 // int alp = pixbuf[offseta];

 int gray = (red + gre + blu)/3;

 pixbuf[offsetr] = gray;
 pixbuf[offsetg] = gray;
 pixbuf[offsetb] = gray;
}

<2>、还原图片:这个其实没什么讲的,只要把过滤前的图片的uiimage进行保存,再次赋值就好

3.2、图片剪切clip

iOS图片压缩、滤镜、剪切及渲染等详解
图片剪切clip

<1>、规则图片剪切(圆形,矩形等)

#pragma mark 剪切图片(规则的剪切图)
-(void)clipimage{

 cgsize size = cgsizemake(100, 100);

 // 开启上下文
 uigraphicsbeginimagecontext(size);
 // 获取当前的上下文
 cgcontextref context = uigraphicsgetcurrentcontext();

 // 设置路径剪切(设置一个圆)
 cgrect rect = cgrectmake(0, 0, size.width, size.height);
 cgcontextaddellipseinrect(context, rect);
 cgcontextclip(context);

 // 把图片绘制上去
 [self.oriimage drawinrect:cgrectmake(0, 0, size.width, size.height)];

 uiimage *clipimage = uigraphicsgetimagefromcurrentimagecontext();

 uigraphicsendimagecontext();

 // 把剪切过的图片展示出来 
 self.imageview2.image = clipimage;
}

<2>、不规则图片剪切(根据自定义path剪切)

#pragma mark 剪切图片(不规则的剪切图)
-(void)irregularclipimage{

 uigraphicsbeginimagecontext(cgsizemake(200, 200));
 cgcontextref context = uigraphicsgetcurrentcontext();

 // 非规则的path
 cgmutablepathref pathref = cgpathcreatemutable();
 cgpoint lines[] = {
  cgpointmake(50,0),
  cgpointmake(100,0),
  cgpointmake(150,80),
  cgpointmake(0,80),
  cgpointmake(50,0)
 };
 cgpathaddlines(pathref, null, lines, 5);
 cgcontextaddpath(context, pathref);
 cgcontextclip(context);

 [self.oriimage drawinrect:cgrectmake(0, 0, 200, 200)];

 uiimage *clipimage = uigraphicsgetimagefromcurrentimagecontext();

 uigraphicsendimagecontext();
 
 // 把剪切过的图片展示出来 
 self.imageview3.image = clipimage;
}

3.3、图片渲染

#pragma mark 在图片上渲染一层半透明的红色
-(void)blend{

 // 原图的大小
 cgsize size = cgsizemake(self.imageview1.frame.size.width, self.imageview1.frame.size.height);

 uigraphicsbeginimagecontext(size);

 cgcontextref context = uigraphicsgetcurrentcontext();

 [self.oriimage drawinrect:cgrectmake(0, 0, size.width, size.height)];

 // 设置半透明红色的渲染
 uicolor *redcolor = [uicolor colorwithred:1 green:0 blue:0 alpha:0.5];
 cgcontextsetfillcolorwithcolor(context, redcolor.cgcolor);
 cgcontextsetblendmode(context, kcgblendmodenormal);
 cgcontextfillrect(context, cgrectmake(0, 0, size.width, size.height));

 // 获取渲染的cgimageref
 cgimageref imageref = cgbitmapcontextcreateimage(context);

 self.imageview1.image = [uiimage imagewithcgimage:imageref];

 uigraphicsendimagecontext();

}

3.4、截屏(截取一个对象上的所有视图),我们以截取self.view的视图为例

iOS图片压缩、滤镜、剪切及渲染等详解
截屏**(截取一个对象上的所有视图),我们以截取self.view的视图为例

<1>、截屏方式一

- (uiimage *)jk_snapshotimage {

 uigraphicsbeginimagecontextwithoptions(self.bounds.size, yes, 0);
 [self.view drawviewhierarchyinrect:self.bounds afterscreenupdates:yes];
 uiimage *result = uigraphicsgetimagefromcurrentimagecontext();
 uigraphicsendimagecontext();

 return result;
}

<2>、截屏方式一

- (uiimage *)imagefromfullview{

 uigraphicsbeginimagecontext(self.view.frame.size);

 cgcontextref context = uigraphicsgetcurrentcontext();

 [self.view.layer renderincontext:context];

 cgimageref imageref = cgbitmapcontextcreateimage(context);

 uiimage *newimage = [uiimage imagewithcgimage:imageref];

 uigraphicsendimagecontext();

 return newimage;
}

此篇博客的 demo (本地下载

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对的支持。