iOS一种高斯模糊渐变动画的实现

转载 2016年08月30日 14:57:43

关于高斯模糊的方式有很多种,但是如果需要模糊渐变,那么对这种高斯模糊算法的性能要求是比较高的,今天这里重点不讨论算法,只是提供一个动画实现的思路。动画效果如下:
这里写图片描述

高斯模糊渐变动画

//高斯模糊
-(UIImage )boxblurImage:(UIImage )image withBlurNumber:(CGFloat)blur {
if (blur < 0.f || blur > 1.f) {
blur = 0.5f;
}
int boxSize = (int)(blur * 250);
boxSize = boxSize - (boxSize % 2) + 1;
CGImageRef img = image.CGImage;
vImage_Buffer inBuffer, outBuffer;
vImage_Error error;
void *pixelBuffer; //从CGImage中获取数据
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;
}

高斯模糊渐变

自动渐变的过程需要加入一个定时器NSTimer,并且循环。每0.1秒循环一次,通过一个变量来计数,以改变blur值。当然,这里的参数根据需要来调整来满足不同的需求。

[NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(changeImageView1) userInfo:nil repeats:YES];
-(void)changeImageView1 {
self.imageView1.image = [self boxblurImage:[UIImage imageNamed:@”login_bg_1”] withBlurNumber:self.count1/50.0];
if (self.count1++ == 15) {
[self.timer1 invalidate];
self.timer1 = nil;
self.count1 = 0;
self.imageView2.image = [UIImage imageNamed:@”login_bg_2”];
[UIView animateWithDuration:2 animations:^{
self.imageView1.alpha = 0;
self.imageView2.alpha = 1;
} completion:^(BOOL finished) {
[NSTimer scheduledTimerWithTimeInterval:2 target:self selector:@selector(imageView2AnimationStart) userInfo:nil repeats:NO];
}]; }
}

动画过渡

在第一张图片模糊到一定程度时,对其做渐变处理,改变其alpha值(从1到0),同时让第二张图显现出来(从1到0)。至此,整个动画就基本完成了。
另外

需要对其他方面做些优化,比如NSTimer的开启与暂停,以及切换到其他页面后需要关闭定时器等。

文/zmp1123(简书作者)
原文链接:http://www.jianshu.com/p/e965c58731c7

iOS简单实现图片模糊渐变效果

文章说明:本文可以说是完全
  • u014589448
  • u014589448
  • 2014年06月10日 17:42
  • 1531

安卓高斯模糊特效blur_demo(包含viewpager切换动画)

public class MainActivity extends FragmentActivity {//高斯模糊效果的主方法入口 private ViewPager viewPager; priv...
  • Scorpio_gao
  • Scorpio_gao
  • 2016年01月13日 13:51
  • 1756

IOS 动画设计(3)——模糊效果的使用总结

App 设计时往往会用到一些模糊效果或者毛玻璃效果, 可以给用户带来一定的视觉享受。IOS 目前已提供一些模糊 API 可以让我们方便使用,也可调用第三方库进行模糊效果的处理,在iOS开发当中,我们有...
  • huangfei711
  • huangfei711
  • 2016年10月04日 17:55
  • 1135

iOS CABasicAnimation CAAnimationGroup 对颜色做连续渐变动画

http://blog.sina.com.cn/s/blog_969096f10101hre7.html //此动画效果分三个阶段 程实原创 //1、从白色变为灰色 程实原创 ...
  • jeffasd
  • jeffasd
  • 2016年11月09日 23:13
  • 3026

iOS一种高斯模糊渐变动画的实现

关于高斯模糊的方式有很多种,但是如果需要模糊渐变,那么对这种高斯模糊算法的性能要求是比较高的,今天这里重点不讨论算法,只是提供一个动画实现的思路。动画效果如下: 高斯模糊渐变动画//高斯模糊 -(...
  • shengdaVolleyball
  • shengdaVolleyball
  • 2016年08月30日 14:57
  • 1826

iOS实现渐变背景色的三种方法

In some particular circumstances, we want to use a gradient background view. As far as my knowledge ...
  • lgouc
  • lgouc
  • 2015年08月03日 13:29
  • 28441

iOS自带实现高斯模糊效果

iOS原生支持实现毛玻璃效果的两种方法
  • Cloudox_
  • Cloudox_
  • 2017年06月03日 10:04
  • 2446

高级android高斯模糊技术-媲美IOS

今天在网上看到一个高斯模糊的blog我就感兴趣起来,最后看了看他的实现方法,觉得可以,就拿过用,结果效率太低了; 最后百度了一大堆但是效率都非常的低,我只要绘制的快一旦久卡死了。悲剧啊,看到...
  • yy1300326388
  • yy1300326388
  • 2015年05月09日 21:47
  • 2280

iOS 模糊效果

现在很多设计中都用到了模糊效果,或当背景,或实现渐变等等,模糊效果的应用范围已经变的越来越广泛。在这里介绍两种模糊效果,毛玻璃与高斯模糊。...
  • zxs947941951
  • zxs947941951
  • 2016年01月04日 15:41
  • 162

iOS开发使用半透明模糊效果方法整理

虽然iOS很早就支持使用模糊效果对图片等进行处理,但尤其在iOS7以后,半透明模糊效果得到大范围广泛使用。包括今年最新发布的iOS8也沿袭了这一设计,甚至在OS X 10.10版Yosemite中也开...
  • ifumu2011
  • ifumu2011
  • 2016年01月06日 14:31
  • 961
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:iOS一种高斯模糊渐变动画的实现
举报原因:
原因补充:

(最多只允许输入30个字)