使用GPUImage重新创建iOS 7 Glass Effect

Question

我试图通过将图像效果应用到屏幕截图来在我的玻璃中使用iOS 7风格的玻璃效果MKMapView.Apple提供的这个UIImage类别是我用作基线的.此方法使用输入值对源图像进行去饱和处理,应用色调颜色并大量模糊:

[image applyBlurWithRadius:10.0
                 tintColor:[UIColor colorWithRed:229/255.0f green:246/255.0f blue:255/255.0f alpha:0.33] 
     saturationDeltaFactor:0.66
                 maskImage:nil];

这会产生我正在寻找的效果,但需要太长时间 - 在iPhone 4上渲染的时间.3和.5秒数之间.

我想使用优秀的,GPUImage因为我的初步尝试速度提高了大约5-10倍,但我似乎无法做到这一点.

GPUImagePicture *stillImageSource = [[GPUImagePicture alloc] initWithImage:image];

GPUImageSaturationFilter *saturationFilter = [[GPUImageSaturationFilter alloc] init];
saturationFilter.saturation = 0.33; // 1.0 - 0.66;
[stillImageSource addTarget:saturationFilter];

GPUImageMonochromeFilter *monochromeFilter = [[GPUImageMonochromeFilter alloc] init];
[monochromeFilter setColor:(GPUVector4){229/255.0f, 246/255.0f, 1.0f, 0.33f}];
[monochromeFilter setIntensity:0.2];
[saturationFilter addTarget:monochromeFilter];

GPUImageFastBlurFilter *blurFilter = [[GPUImageFastBlurFilter alloc] init];
blurFilter.blurSize = 2;
blurFilter.blurPasses = 3;
[monochromeFilter addTarget:blurFilter];

[saturationFilter prepareForImageCapture];
[monochromeFilter prepareForImageCapture];

[stillImageSource processImage];
image = [blurFilter imageFromCurrentlyProcessedOutput];

这会产生一个接近但不完全存在的图像

模糊似乎不够深,但当我尝试增加blurSize上面的内容时,它变得像网格一样,几乎就像一个万花筒.您可以通过放大第二个图像来实际看到网格.我试图模仿的色调似乎只是洗掉图像而不是叠加和混合,我认为Apple样本正在做.

我试图根据@BradLarson在另一个SO问题中提出的意见来设置过滤器.我使用错误的GPUImage过滤器来重现这种效果,还是我只是把它们设置错了？

Answer 1

好的,我已经在这里做了一些事情,我终于有了它的功能.我刚刚对GPUImage的模糊过滤器进行了一些更改到框架中,因此我相信我有一个合理的Apple模糊效果复制品,它们用于控制中心视图等.

以前,我在框架中使用的模糊使用了一个预先计算的半径,并且影响其强度的唯一方法是调整它们从输入图像中采样像素的间距.对于每个像素的有限数量的样本,改变多于1.5的采样像素之间的间隔的倍数开始引入严重的块效应,因为像素被跳过.

我构建的新高斯模糊实现结合了预先计算的高斯权重的性能优势和使用任意半径(sigma)进行高斯模糊的能力.它通过动态生成着色器来实现这一点,因为它们是各种半径所需的.它还通过使用硬件插值为每个采样点一次读取两个纹素,减少了给定模糊半径所需的纹理样本数.

新的GPUImageiOSBlurFilter将这个经过调整的任意半径高斯模糊滤镜与一个色彩校正滤镜相结合,该色彩校正滤镜可以复制Apple在模糊后对色彩进行的调整.我加入了以下比较,我的答案在这里,但它表明苹果的内置从左侧和右侧我的新GPUImage模糊滤镜控制中心视图模糊:

作为一种提高性能的方法(Apple的模糊似乎发生在48的sigma,这需要为每个像素采样相当大的区域),我在高斯模糊之前使用4X下采样,然后使用4X上采样.这样可以将需要模糊16倍的像素数量减少,并且还可以将模糊sigma从48减少到12.使用此滤镜,iPhone 4S可以在大约30 ms内模糊整个屏幕.

弄清楚模糊是一回事.Apple仍然没有提供快速获取视图背后的图像内容的方法,因此很可能会成为快速变化内容的瓶颈.