UnityShader实例16:屏幕特效之径向模糊(Radial Blur)photoshop手机版下载「UnityShader实例16:屏幕特效之径向模糊(Radial Blur)」
导读: 径向模糊,是一种从中心向外呈幅射状的逐渐模糊的效果(如下图),在图形处理软件photoshop里面也有这个模糊滤镜。而在游戏中常常用来模拟一些动感的效果,如鬼泣4中的场景切换特效,和一些技能打击特效;赛车游戏也尝用来模拟动感模糊,如狂野飙车,极品飞车等。本例将实现一个类似效果适用于手机平台的径向模糊效果,...
径向模糊,是一种从中心向外呈幅射状的逐渐模糊的效果(如下图),在图形处理软件photoshop里面也有这个模糊滤镜。而在游戏中常常用来模拟一些动感的效果,如鬼泣4中的场景切换特效,和一些技能打击特效;赛车游戏也尝用来模拟动感模糊,如狂野飙车,极品飞车等。本例将实现一个类似效果适用于手机平台的径向模糊效果,将开放模糊强度以及模糊范围两个参数调整模糊效果。
径向模糊和高斯模糊等其他模糊效果一样,原像素都要周围附近的像素的颜色值共同影响。如高斯模糊就是将原像素四周像素的颜色加权求和作为原像素的颜色以达到模糊的目的,而径向模糊的特点是从某个像素为中心向外辐射状扩散,因此需要采样的像素在原像素和中间点像素的连线上,不同连线上的点不会相互影响。简单的说,就是像素的颜色是由该像素的点与中心点之间连线上进行采样(如图),然后求将这些采样点颜色的加权平均和作为该像素的颜色。根据径向模糊的特性,离目标点越近采样点越密集,反之亦然。
由此我们可以大概确定下径向模糊实现的流程:
- 第一步:确定径向模糊的中心点,通常取图像的正中心点、
- 第二步:计算采样像素与中心点的距离,根据距离确定偏移程度,即离中心点越远,偏移量越大。
- 第三步:将采样点的颜色值做加权求和,本例使用平均求和。
- 第四步:将前面的结果与原图像做一个lerp差值合成
从径向模糊的原理可知,由于需要获知每个像素点距离中心点的距离,并且根据采样点的距离采样偏移不一样,,因此不能像高斯模糊那样在vert函数里面进行uv整理偏移采样,只能在frag函数中逐像素计算,因此当分辨率越大,计算量成几何倍数增长。对于一些高分辨率的设备,比如ipad4,iphone6等,如果直接采样的话,则可能导致帧率下降得很厉害的结果,甚至还不如iphone5的帧率 。
没法从vert函数那里优化,那么只能降低frag函数部分的采样,最简单的方法就是降低屏幕图像的分辨率。但付出的代价就是需要两个缓存来存贮屏幕图像,增加2个drawcall,不过还是值得的,真机测试帧率提高了不少。流程也因此也得改一下,得分两个pass分别处理模糊计算(降低分辨率计算)和lerp差值合成(恢复到正常分辨率)。这样保证最后输出的结果还是原来的分辨率,清晰部分不变,而模糊部分质量稍微有下降,但实际效果还是可以接受的。
这里我只放出关键代码,需要完整代码可以点文章后面链接下载。
根据需求我们需要从C#脚本传递两个参数_SampleDist和_SampleStrength分别控制模糊强度和模糊范围:
从优化流程可知,我们需要两个pass分别处理模糊计算和lerp差值合成,先处理模糊计算,主要计算在frag函数中完成。需要注意的是,从C#传递过来的图像是已经降低过分辨率的,关键代码如下:
另外一个pass用上一个pass处理好的模糊结果与源图像做差值合成,其中_SampleStrength控制模糊的范围,这一步使用的是正常分辨率的计算。
C#脚本比较简单,主要是将屏幕图像降低分辨率传给shader处理,这里只放出关键代码,需要完整代码请到文章后面的下载链接下载。
安宁版权声明:本网信息来自于互联网,目的在于传递更多信息,并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益,请及时联系我们,本站将会在24小时内处理完毕,E-mail:xinmeigg88@163.com