iOS7 毛玻璃效果
转自:http://prolove10.blog.163.com/blog/static/138411843201391401054305/
原图:

效果图:

实现:
首先需要导入Accelerate.framework。
然后把两个文件加入到自己的项目中即可。
UIImage+ImageEffects.h
#import @interfaceUIImage(ImageEffects) -(UIImage*)applyLightEffect;
-(UIImage*)applyExtraLightEffect;
-(UIImage*)applyDarkEffect;
-(UIImage*)applyTintEffectWithColor:(UIColor*)tintColor; -(UIImage*)applyBlurWithRadius:(CGFloat)blurRadius tintColor:(UIColor*)tintColor saturationDeltaFactor:(CGFloat)saturationDeltaFactor maskImage:(UIImage*)maskImage; @end
UIImage+ImageEffects.m
#import "UIImage+ImageEffects.h" #import
#import @implementationUIImage(ImageEffects) -(UIImage*)applyLightEffect
{
UIColor*tintColor =[UIColor colorWithWhite:1.0 alpha:0.3];
return[self applyBlurWithRadius:30 tintColor:tintColor saturationDeltaFactor:1.8 maskImage:nil];
} -(UIImage*)applyExtraLightEffect
{
UIColor*tintColor =[UIColor colorWithWhite:0.97 alpha:0.82];
return[self applyBlurWithRadius:20 tintColor:tintColor saturationDeltaFactor:1.8 maskImage:nil];
} -(UIImage*)applyDarkEffect
{
UIColor*tintColor =[UIColor colorWithWhite:0.11 alpha:0.73];
return[self applyBlurWithRadius:20 tintColor:tintColor saturationDeltaFactor:1.8 maskImage:nil];
} -(UIImage*)applyTintEffectWithColor:(UIColor*)tintColor
{
constCGFloatEffectColorAlpha=0.6;
UIColor*effectColor = tintColor;
int componentCount =CGColorGetNumberOfComponents(tintColor.CGColor);
if(componentCount ==2){
CGFloat b;
if([tintColor getWhite:&b alpha:NULL]){
effectColor =[UIColor colorWithWhite:b alpha:EffectColorAlpha];
}
}
else{
CGFloat r, g, b;
if([tintColor getRed:&r green:&g blue:&b alpha:NULL]){
effectColor =[UIColor colorWithRed:r green:g blue:b alpha:EffectColorAlpha];
}
}
return[self applyBlurWithRadius:10 tintColor:effectColor saturationDeltaFactor:-1.0 maskImage:nil];
} -(UIImage*)applyBlurWithRadius:(CGFloat)blurRadius tintColor:(UIColor*)tintColor saturationDeltaFactor:(CGFloat)saturationDeltaFactor maskImage:(UIImage*)maskImage
{
// Check pre-conditions.
if(self.size.width <1||self.size.height <1){
NSLog(@"*** error: invalid size: (%.2f x %.2f). Both dimensions must be >= 1: %@",self.size.width,self.size.height,self);
returnnil;
}
if(!self.CGImage){
NSLog(@"*** error: image must be backed by a CGImage: %@",self);
returnnil;
}
if(maskImage &&!maskImage.CGImage){
NSLog(@"*** error: maskImage must be backed by a CGImage: %@", maskImage);
returnnil;
} CGRect imageRect ={CGPointZero,self.size };
UIImage*effectImage =self; BOOL hasBlur = blurRadius > __FLT_EPSILON__;
BOOL hasSaturationChange = fabs(saturationDeltaFactor -1.)> __FLT_EPSILON__;
if(hasBlur || hasSaturationChange){
UIGraphicsBeginImageContextWithOptions(self.size, NO,[[UIScreen mainScreen] scale]);
CGContextRef effectInContext =UIGraphicsGetCurrentContext();
CGContextScaleCTM(effectInContext,1.0,-1.0);
CGContextTranslateCTM(effectInContext,0,-self.size.height);
CGContextDrawImage(effectInContext, imageRect,self.CGImage); vImage_Buffer effectInBuffer;
effectInBuffer.data =CGBitmapContextGetData(effectInContext);
effectInBuffer.width =CGBitmapContextGetWidth(effectInContext);
effectInBuffer.height =CGBitmapContextGetHeight(effectInContext);
effectInBuffer.rowBytes =CGBitmapContextGetBytesPerRow(effectInContext); UIGraphicsBeginImageContextWithOptions(self.size, NO,[[UIScreen mainScreen] scale]);
CGContextRef effectOutContext =UIGraphicsGetCurrentContext();
vImage_Buffer effectOutBuffer;
effectOutBuffer.data =CGBitmapContextGetData(effectOutContext);
effectOutBuffer.width =CGBitmapContextGetWidth(effectOutContext);
effectOutBuffer.height =CGBitmapContextGetHeight(effectOutContext);
effectOutBuffer.rowBytes =CGBitmapContextGetBytesPerRow(effectOutContext); if(hasBlur){
// A description of how to compute the box kernel width from the Gaussian
// radius (aka standard deviation) appears in the SVG spec:
// http://www.w3.org/TR/SVG/filters.html#feGaussianBlurElement
//
// For larger values of 's' (s >= 2.0), an approximation can be used: Three
// successive box-blurs build a piece-wise quadratic convolution kernel, which
// approximates the Gaussian kernel to within roughly 3%.
//
// let d = floor(s * 3*sqrt(2*pi)/4 + 0.5)
//
// ... if d is odd, use three box-blurs of size 'd', centered on the output pixel.
//
CGFloat inputRadius = blurRadius *[[UIScreen mainScreen] scale];
NSUInteger radius = floor(inputRadius *3.* sqrt(2* M_PI)/4+0.5);
if(radius %2!=1){
radius +=1;// force radius to be odd so that the three box-blur methodology works.
}
vImageBoxConvolve_ARGB8888(&effectInBuffer,&effectOutBuffer, NULL,0,0, radius, radius,0, kvImageEdgeExtend);
vImageBoxConvolve_ARGB8888(&effectOutBuffer,&effectInBuffer, NULL,0,0, radius, radius,0, kvImageEdgeExtend);
vImageBoxConvolve_ARGB8888(&effectInBuffer,&effectOutBuffer, NULL,0,0, radius, radius,0, kvImageEdgeExtend);
}
BOOL effectImageBuffersAreSwapped = NO;
if(hasSaturationChange){
CGFloat s = saturationDeltaFactor;
CGFloat floatingPointSaturationMatrix[]={
0.0722+0.9278* s,0.0722-0.0722* s,0.0722-0.0722* s,0,
0.7152-0.7152* s,0.7152+0.2848* s,0.7152-0.7152* s,0,
0.2126-0.2126* s,0.2126-0.2126* s,0.2126+0.7873* s,0,
0,0,0,1,
};
constint32_t divisor =256;
NSUInteger matrixSize =sizeof(floatingPointSaturationMatrix)/sizeof(floatingPointSaturationMatrix[0]);
int16_t saturationMatrix[matrixSize];
for(NSUInteger i =0; i < matrixSize;++i){
saturationMatrix[i]=(int16_t)roundf(floatingPointSaturationMatrix[i]* divisor);
}
if(hasBlur){
vImageMatrixMultiply_ARGB8888(&effectOutBuffer,&effectInBuffer, saturationMatrix, divisor, NULL, NULL, kvImageNoFlags);
effectImageBuffersAreSwapped = YES;
}
else{
vImageMatrixMultiply_ARGB8888(&effectInBuffer,&effectOutBuffer, saturationMatrix, divisor, NULL, NULL, kvImageNoFlags);
}
}
if(!effectImageBuffersAreSwapped)
effectImage =UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext(); if(effectImageBuffersAreSwapped)
effectImage =UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
} // Set up output context.
UIGraphicsBeginImageContextWithOptions(self.size, NO,[[UIScreen mainScreen] scale]);
CGContextRef outputContext =UIGraphicsGetCurrentContext();
CGContextScaleCTM(outputContext,1.0,-1.0);
CGContextTranslateCTM(outputContext,0,-self.size.height); // Draw base image.
CGContextDrawImage(outputContext, imageRect,self.CGImage); // Draw effect image.
if(hasBlur){
CGContextSaveGState(outputContext);
if(maskImage){
CGContextClipToMask(outputContext, imageRect, maskImage.CGImage);
}
CGContextDrawImage(outputContext, imageRect, effectImage.CGImage);
CGContextRestoreGState(outputContext);
} // Add in color tint.
if(tintColor){
CGContextSaveGState(outputContext);
CGContextSetFillColorWithColor(outputContext, tintColor.CGColor);
CGContextFillRect(outputContext, imageRect);
CGContextRestoreGState(outputContext);
} // Output image is ready.
UIImage*outputImage =UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext(); return outputImage;
} @end
调用:
UIImageView*me =[[UIImageView alloc] initWithFrame:CGRectMake(10,480,614,381)];
[me setImage:[[UIImage imageNamed:@"me.png"] applyBlurWithRadius:5 tintColor:[UIColor colorWithWhite:1 alpha:0.2] saturationDeltaFactor:1.8 maskImage:nil]];
[self.view addSubview:me];
ok!So easy!
iOS7 毛玻璃效果的更多相关文章
- ios7毛玻璃效果实现
首先看效果: 核心代码: //加模糊效果,image是图片,blur是模糊度 - (UIImage *)blurryImage:(UIImage *)image withBlurLevel ...
- 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果
去年盛夏之时,曾写过“小tip: 使用CSS将图片转换成黑白”一文,本文的模式以及内容其实走得是类似路线.CSS3 → SVG → IE filter → canvas. 前段时间,iOS7不是瓜未熟 ...
- [转] 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果 ---张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=3804 去年盛夏之时, ...
- iOS 实现毛玻璃效果
话说苹果在iOS7.0之后,很多系统界面都使用了毛玻璃效果,增加了界面的美观性,比如下图的通知中心界面; 但是其iOS7.0的SDK并没有提供给开发者实现毛玻璃效果的API,所以很多人都是通过一些别人 ...
- iOS开发探索-高斯模糊&毛玻璃效果
iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...
- iOS_自定义毛玻璃效果
http://www.2cto.com/kf/201408/329969.html 最终效果图: 关键代码: UIImage分类代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 1 ...
- iOS_自己定义毛玻璃效果
终于效果图: 关键代码: UIImage分类代码 // // UIImage+BlurGlass.h // 帅哥_团购 // // Created by beyond on 14-8-30. // C ...
- iOS 毛玻璃效果的实现方法
iOS开发中有的时候需要将图片设置模糊,来实现特定的效果获取更好的用户体验, iOS7之后半透明模糊效果得到大范围使用的比较大,现在也可以看到很多应用局部用到了图片模糊效果,可以通过高斯模糊和毛玻璃效 ...
- 使用CSS3制作导航条和毛玻璃效果
导航条对于每一个Web前端攻城狮来说并不陌生,但是毛玻璃可能会相对陌生一些.简单的说,毛玻璃其实就是让图片或者背景使用相应的方法进行模糊处理.这种效果对用户来说是十分具有视觉冲击力的. 本次分享的主题 ...
随机推荐
- HDU 6041 I Curse Myself(点双联通加集合合并求前K大) 2017多校第一场
题意: 给出一个仙人掌图,然后求他的前K小生成树. 思路: 先给出官方题解 由于图是一个仙人掌,所以显然对于图上的每一个环都需要从环上取出一条边删掉.所以问题就变为有 M 个集合,每个集合里面都有一堆 ...
- 为什么JS是单线程?JS中的Event Loop(事件循环)?JS如何实现异步?setimeout?
https://segmentfault.com/a/1190000012806637 https://www.jianshu.com/p/93d756db8c81 首先,请牢记2点: (1) JS是 ...
- CAD交互绘制圆形云线批注(网页版)
js中实现代码说明: 动态拖放时的绘制事件: function DoDynWorldDrawFun(dX,dY,pWorldDraw,pData) { //自定义实体的GUID标识符 var sGui ...
- 数组初始化 和 vector初始化
] = {}; 整个数组都初始化为0 vector<); 整个vector初始化为1 如果你定义的vector是这样定义的: vector<int> B; 去初始化,千万不要用: ; ...
- python基础面试题整理---从零开始 每天十题(02)
书接上回,我们继续来说说python的面试题,我在各个网站搜集了一些,我给予你们一个推荐的答案,你们可以组织成自己的语言来说出来,让我们更好的做到面向工资编程 一.Q:说说你对zen of pytho ...
- 【转】Python 访问 HDFS
1.前言 hdfs , Hadoop Distributed File System.Hadoop的分布式文件系统,安全行和扩展性没得说. 访问HDFS的方式有以下几种: 命令行方式:FS Shell ...
- 【转载】K-mer算法
k-mer是指将reads分成包含k个碱基的字符串,一般长短为m的reads可以分成m-k+1个k-mers.举个例子吧,为了简化,有这么个reads(当然实际比这个长):AACTGACTGA.如果k ...
- 使用JAVA抓取网页数据
一.使用 HttpClient 抓取网页数据 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 ...
- 智能指针之 weak_ptr
1. weak_ptr 介绍 std::weak_ptr 是一种智能指针,它对被 std::shared_ptr 管理的对象存在非拥有性("弱")引用.在访问所引用的对象指针前必须 ...
- 如何用纯 CSS 创作牛奶文字变换效果
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/MGNWOm 可交互视频教 ...