效果圖
1.png
Demo下載地址:VisualDemo,覺得不錯還請給個star
前言
日常處理毛玻璃效果, 主要的用到就是這幾種方式
1.iOS5.0之后就出現(xiàn)了Core Image的API业岁。Core Image的API被放在CoreImage.framework庫中欺矫。在iOS和OS X平臺上磺陡，Core Image都提供了大量的濾鏡（Filter）猜旬，這也是Core Image庫中比較核心的東西之一肮街。按照官方文檔記載蛋逾，在OS X上有120多種Filter速勇，而在iOS上也有90多種截珍。
2.第三方框架GPUImage
3.iOS 7之前UIToolbar
4.iOS 8之后蘋果新增加的一個類UIVisualEffectView
5.vImage也是蘋果推出的一個庫在Accelerate.framework框架中
下面就依次講述這幾種方式的實現(xiàn)
Core Image實現(xiàn)方式代碼如下:
- (UIImage *)coreBlurImage:(UIImage *)image withBlurNumber:(CGFloat)blur{
//獲取繪制上下文
CIContext *context = [CIContext contextWithOptions:nil];
//獲取CIImage
CIImage *inputImage = [CIImage imageWithCGImage:image.CGImage];
//創(chuàng)建濾鏡對象 CIGaussianBlur:高斯模糊
CIFilter *filter = [CIFilter filterWithName:@"CIGaussianBlur"];
[filter setValue:inputImage forKey:kCIInputImageKey];
//改變模糊效果值
[filter setValue:@10.0f forKey:@"inputRadius"];
//模糊圖片渲染并輸出CIImage
CIImage *result = [filter valueForKey:kCIOutputImageKey];
CGImageRef outImage = [context createCGImage:result fromRect:[result extent]];
UIImage *blurImage = [UIImage imageWithCGImage:outImage];
CGImageRelease(outImage);
return blurImage;
}
CIGaussianBlur即是常用的高斯濾鏡, Filter都是按字符串的名字去創(chuàng)建的, 詳情見官方文檔除了這里提到的多種Filter之外锚扎，Core Image還提供了CIDetector等類吞瞪，可以支持人臉識別等，在OS X上Core Image也做了更多支持驾孔。
GPUImage
GPUImageGaussianBlurFilter * blurFilter = [[GPUImageGaussianBlurFilter alloc] init];
blurFilter.blurRadiusInPixels = 2.0;
UIImage * image = [UIImage imageNamed:@"xxx"];
UIImage *blurredImage = [blurFilter imageByFilteringImage:image];
代碼上比使用Core Image的情況簡單得多
上面2種都是比較耗性能的, 慎用
UIToolbar簡單易懂芍秆，但是效果單一惯疙，系統(tǒng)提供的樣式也就UIBarStyleDefault和UIBarStyleBlack兩種
UIImageView *imageView = [[UIImageView alloc] initWithFrame:self.view.bounds];
imageView.image = [UIImage imageNamed:@"image"];
imageView.contentMode = UIViewContentModeScaleAspectFill;
imageView.layer.masksToBounds = YES;
[self.view addSubview:imageView];
/** UIBarStyle 毛玻璃的樣式(枚舉)
* UIBarStyleDefault = 0, // 淺色
* UIBarStyleBlack = 1, // 深色
* UIBarStyleBlackOpaque = 1, // Deprecated. Use UIBarStyleBlack
* UIBarStyleBlackTranslucent = 2, // Deprecated. Use UIBarStyleBlack and set the translucent property to YES
*/
UIToolbar * toolbar = [[UIToolbar alloc] initWithFrame:imageView.bounds];
toolbar.barStyle = UIBarStyleBlack;
toolbar.alpha = 0.9;
[imageView addSubview:toolbar];
UIVisualEffectView: 比UIToolbar強大一點, 主要用到了這個類
UIVisualEffect: 繼承自UIView，可以看成是專門用于處理毛玻璃效果的視圖妖啥。使用UIVisuaEffectView有一點需要特別注意霉颠，不要在UIVisuaEffectView實例化View上面直接添加subViews，應該將需要添加的子視圖添加到其contentView上荆虱。同時蒿偎，盡量避免將UIVisualEffectView對象的alpha值設置為小于1.0的值，因為創(chuàng)建半透明的視圖會導致系統(tǒng)在離屏渲染時去對UIVisualEffectView對象及所有的相關的子視圖做混合操作,比較消耗性能怀读。UIBlurEffect: 使用該效果诉位，會使得UIVisualEffectView下面的內(nèi)容出現(xiàn)毛玻璃化UIVibrancyEffect: 生動效果, 該效果能夠放大和調(diào)整放在UIVisualEffectView對象下面的內(nèi)容的顏色UIVisualEffect：一個視覺效果抽象類，繼承自NSObject菜枷，是UIBlurEffect和UIVibrancyEffect的父類
UIBlurEffect
_imageView = [[UIImageView alloc] initWithFrame:self.view.bounds];
_imageView.image = [UIImage imageNamed:@"image"];
_imageView.contentMode = UIViewContentModeScaleAspectFill;
_imageView.layer.masksToBounds = YES;
[self.view addSubview:_imageView];
/** UIBlurEffect 毛玻璃的樣式(枚舉)
* UIBlurEffectStyleExtraLight, // 極度白
* UIBlurEffectStyleLight, // 淺色
* UIBlurEffectStyleDark // 深色
*/
UIBlurEffect * effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView * effectView = [[UIVisualEffectView alloc] initWithEffect:effect];
effectView.frame = CGRectMake(0, 100, self.view.bounds.size.width, 200);
[_imageView addSubview:effectView];
UIVibrancyEffect
UIBlurEffect * blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVibrancyEffect * vibrancy = [UIVibrancyEffect effectForBlurEffect:blurEffect];
UIVisualEffectView * effectView = [[UIVisualEffectView alloc] initWithEffect:vibrancy];
UIView *redView = [[UIView alloc]init];
redView.backgroundColor = [UIColor blueColor];
[effectView.contentView addSubview:redView];
effectView.frame = CGRectMake(0, 310,375, 300);
redView.frame = effectView.bounds;
[self.view addSubview:effectView];
效果圖:
3.png
運用
UIBlurEffect是可逆的苍糠，我們可以去掉蒙層，顯示圖片
[effectView removeFromSuperview];
vImage是Accelerate.framework框架中的這個framework主要是用來做數(shù)字信號處理啤誊、圖像處理相關的向量岳瞭、矩陣運算的庫。首先導入#import <Accelerate/Accelerate.h>我們可以認為我們的圖像都是由向量或者矩陣數(shù)據(jù)構成的坷衍，Accelerate里既然提供了高效的數(shù)學運算API寝优，自然就能方便我們對圖像做各種各樣的處理。模糊算法就是用到了vImageBoxConvolve_ARGB8888這個函數(shù):
- (UIImage *)boxblurImage:(UIImage *)image withBlurNumber:(CGFloat)blur
{
if (blur < 0.f || blur > 1.f) {
blur = 0.5f;
}
int boxSize = (int)(blur * 40);
boxSize = boxSize - (boxSize % 2) + 1;
CGImageRef img = image.CGImage;
vImage_Buffer inBuffer, outBuffer;
vImage_Error error;
void *pixelBuffer;
//從CGImage中獲取數(shù)據(jù)
CGDataProviderRef inProvider = CGImageGetDataProvider(img);
CFDataRef inBitmapData = CGDataProviderCopyData(inProvider);
//設置從CGImage獲取對象的屬性
inBuffer.width = CGImageGetWidth(img);
inBuffer.height = CGImageGetHeight(img);
inBuffer.rowBytes = CGImageGetBytesPerRow(img);
inBuffer.data = (void*)CFDataGetBytePtr(inBitmapData);
pixelBuffer = malloc(CGImageGetBytesPerRow(img) * CGImageGetHeight(img));
if(pixelBuffer == NULL)
NSLog(@"No pixelbuffer");
outBuffer.data = pixelBuffer;
outBuffer.width = CGImageGetWidth(img);
outBuffer.height = CGImageGetHeight(img);
outBuffer.rowBytes = CGImageGetBytesPerRow(img);
error = vImageBoxConvolve_ARGB8888(&inBuffer, &outBuffer, NULL, 0, 0, boxSize, boxSize, NULL, kvImageEdgeExtend);
if(error){
NSLog(@"error from convolution %ld", error);
}
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef ctx = CGBitmapContextCreate( outBuffer.data, outBuffer.width, outBuffer.height, 8, outBuffer.rowBytes, colorSpace, kCGImageAlphaNoneSkipLast);
CGImageRef imageRef = CGBitmapContextCreateImage(ctx);
UIImage *returnImage = [UIImage imageWithCGImage:imageRef];
//clean up CGContextRelease(ctx)
CGColorSpaceRelease(colorSpace);
free(pixelBuffer);
CFRelease(inBitmapData);
CGColorSpaceRelease(colorSpace);
CGImageRelease(imageRef);
return returnImage;
}
總結(jié):
以上就是幾種常用的毛玻璃處理方式, 寫的不好還請小伙伴們見諒!
