前言
女孩子都喜歡用美圖工具進行圖片美容,近來無事時翼岁,特意為某人寫了個自定義圖片濾鏡生成器,安裝到手機即可完成自定義濾鏡渲染照片司光。app獨一無二琅坡,雖簡亦繁。
核心技術(shù)
圖片濾鏡核心技術(shù)的基本思路如下:
具體流程
1残家、創(chuàng)建一個圖像處理工具類
注:該類實例包括一個圖像處理方法榆俺,該方法在傳入原始圖像和一個顏色矩陣后生成一個處理好的圖像。
@interface JHFeilterManager : NSObject
@property (nonatomic,copy)imageBlock imageBLOCK;
- (UIImage *)createImageWithImage:(UIImage *)inImage colorMatrix:(const float *)f;
2坞淮、獲取圖像的每個像素點的RGBA值數(shù)組
注:該c方法返回一個指針茴晋,該指針指向一個數(shù)組,數(shù)組中的每四個元素都是圖像上的一個像素點的RGBA的數(shù)值(0-255)回窘,用無符號的char是因為它正好的取值范圍就是0-255
static unsigned char *RequestImagePixelData(UIImage * inImage){
CGImageRef img = [inImage CGImage];
CGSize size = [inImage size];
//使用上面的函數(shù)創(chuàng)建上下文
CGContextRef cgctx = CreateRGBABitmapContex(img);
CGRect rect = {{0,0},{size.width,size.height}};
//將目標圖像繪制到指定的上下文诺擅,實際為上下文內(nèi)的bitmapData。
CGContextDrawImage(cgctx, rect, img);
unsigned char *data = CGBitmapContextGetData(cgctx);
//釋放上面的函數(shù)創(chuàng)建的上下文
CGContextRelease(cgctx);
cgctx = NULL;
return data;
}
3啡直、調(diào)整一個像素點的RGBA值
注:如下方法傳入?yún)?shù)為數(shù)值指針和一個顏色矩陣烁涌,通過顏色矩陣調(diào)整指針指向地址存儲的數(shù)值
static void changeRGB(int *red,int* green,int*blue,int*alpha ,const float *f){
int redV = *red;
int greenV = *green;
int blueV = *blue;
int alphaV = *alpha;
//色值重新計算 計算規(guī)則如下
*red = f[0] * redV + f[1]*greenV + f[2]*blueV + f[3] * alphaV + f[4];
*green = f[5] * redV + f[6]*greenV + f[7]*blueV + f[8] * alphaV+ f[9];
*blue = f[10] * redV + f[11]*greenV + f[12]*blueV + f[11] * alphaV+ f[14];
*alpha = f[15] * redV + f[16]*greenV + f[17]*blueV + f[18] * alphaV+ f[19];
*red < 0 ? (*red = 0):(0);
*red > 255 ? (*red = 255):(0);
*green < 0 ? (*green = 0):(0);
*green > 255 ? (*green = 255):(0);
*blue < 0 ? (*blue = 0):(0);
*blue > 255 ? (*blue = 255):(0);
*alpha < 0 ? (*alpha = 0):(0);
*alpha > 255 ? (*alpha = 255):(0);
}
4、遍歷每個像素酒觅,調(diào)整色值
注意4橹础!舷丹!
在以下方法中抒钱,不要立刻釋放malloc方法生成的bitmapData內(nèi)存空間指針,(可能有的朋友覺得已經(jīng)把內(nèi)存空間地址給了位圖上下文就可以立馬釋放掉了,但是實際上谋币,由于位圖上下文在后來的圖像渲染時仗扬,仍然需要這一塊內(nèi)存,因此不能在此處立馬釋放掉內(nèi)存瑞信,之前拜讀的幾篇博客索性就不釋放內(nèi)存了厉颤,因此會導(dǎo)致內(nèi)存泄漏穴豫,處理一些高清圖像時凡简,手機內(nèi)存會輕易飆升到1G以上,而導(dǎo)致程序掛掉)不然會導(dǎo)致位圖上下文的內(nèi)容數(shù)據(jù)不能正常存在而導(dǎo)致圖片生成失敗精肃,在這里需要一個全局內(nèi)存指針來指向它秤涩,并且在合適的時候釋放內(nèi)存。
該方法中需要傳入一個原始圖片信息和一個顏色矩陣司抱,顏色矩陣決定了圖像的渲染效果筐眷,因此不同的濾鏡效果可以通過設(shè)置不同的顏色矩陣進行轉(zhuǎn)換,如果您不了解顏色矩陣习柠,點擊這里進行了解
- (UIImage *)createImageWithImage:(UIImage *)inImage colorMatrix:(const float *)f{
/* 圖片位圖像素值數(shù)組 */
unsigned char *imgPixel = RequestImagePixelData(inImage);
CGImageRef inImageRef = [inImage CGImage];
/* 獲取像素的橫向和縱向個數(shù) */
long w = CGImageGetWidth(inImageRef);
long h = CGImageGetHeight(inImageRef);
int wOff = 0;
int pixOff = 0;
/* 遍歷修改位圖像素值 */
for (long y = 0; y<h; y++) {
pixOff = wOff;
for (long x = 0; x<w; x++) {
int red = (unsigned char)imgPixel[pixOff];
int green = (unsigned char)imgPixel[pixOff+1];
int blue = (unsigned char)imgPixel[pixOff +2];
int alpha = (unsigned char)imgPixel[pixOff +3];
changeRGB(&red, &green, &blue, &alpha,f);
imgPixel[pixOff] = red;
imgPixel[pixOff + 1] = green;
imgPixel[pixOff + 2] = blue;
imgPixel[pixOff + 3] = alpha;
pixOff += 4;
}
wOff += w * 4 ;
}
NSInteger dataLength = w * h * 4;
//創(chuàng)建要輸出的圖像的相關(guān)參數(shù)
CGDataProviderRef provider = CGDataProviderCreateWithData(NULL, imgPixel, dataLength, NULL);
if (!provider) {
NSLog(@"創(chuàng)建輸出圖像相關(guān)參數(shù)失斣纫ァ!");
}else{
//每個像素點每個顏色的空間大小 單位為bit
int bitsPerComponent = 8;
//每個像素的空間大小 單位為bit
int bitsPerPixel = 32;
//每一行的顏色點的個數(shù) 每個像素有4個顏色點 每行有2個點
ItemCount bytesPerRow = 4 * w;
//創(chuàng)建RBGA色彩空間
CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();
//位圖的組成部分信息
CGBitmapInfo bitmapInfo = kCGBitmapByteOrderDefault;
//圖像渲染參數(shù) 使用默認值
CGColorRenderingIntent rederingIntent = kCGRenderingIntentDefault;
//創(chuàng)建要輸出的圖像资溃,參數(shù)依次為 寬武翎、高、每個像素點的大小溶锭、每行占用空間大小宝恶、顏色空間、位圖信息趴捅、相關(guān)輸出參數(shù)
CGImageRef imageRef = CGImageCreate(w, h,bitsPerComponent, bitsPerPixel, bytesPerRow, colorSpaceRef, bitmapInfo, provider,NULL, NO, rederingIntent);
if (!imageRef) {
NSLog(@"創(chuàng)建輸出圖像失敗");
}else{
UIImage *my_image = [UIImage imageWithCGImage:imageRef];
CFRelease(imageRef);
CGColorSpaceRelease(colorSpaceRef);
CGDataProviderRelease(provider);
if (_imageBLOCK) {
_imageBLOCK(my_image);
}
NSData *data = UIImageJPEGRepresentation(my_image, 1.0);
//在此釋放位圖空間
free(bitmap);
return [UIImage imageWithData:data];
}
}
return nil;
}
5垫毙、UI搭建
UI界面非常簡單,就是一張大圖拱绑、20個顏色矩陣的信息錄入框和兩個按鈕組成综芥,代碼就不過多贅述了,有需要的話可以到這里下載demo猎拨,喜歡的話不防給個star哦膀藐。
成果展示
成型的demo就是這個樣子嘍!