UnityShader实例15:屏幕特效之Bloom

2024-05-28 23:32
文章标签 15 特效 实例 屏幕 unityshader bloom

本文主要是介绍UnityShader实例15:屏幕特效之Bloom，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

Bloom特效


概述

       Bloom,又称“全屏泛光”，是游戏中常用的一种镜头效果，是一种比较廉价的“伪HDR”效果（如下右图）；使用了Bloom效果后，画面的对比会得到增强，亮的地方曝光也会得到加强，画面也会呈现一种朦胧，梦幻的效果，婚纱摄影中照片处理经常用到这种类似处理效果。Bloom效果一般用来近似模拟HDR效果，效果也比较相向，但实现原理却完全不同。本例将实现一个适合移动平台使用的bloom屏幕特效。





Bloom特效与HDR特效的异同
       要比较两者的异同，得先搞清楚HDR特效是什么；HDR，本身是High-Dynamic Range（高动态范围）的缩写，这本来是一个CG概念。HDR的含义，简单说，就是超越普通的光照的颜色和强度的光照。计算机在表示图象的时候是用8bit(256)级或16bit(65536)级来区分图象的亮度的，但这区区几百或几万无法再现真实自然的光照情况。因此普通情况下，无法同时显示亮部和暗部的所有细节。
       现实中，当人由黑暗地方走到光亮地方，眼睛会自动眯起来。人在黑暗的地方，为了看清楚对象，瞳孔会很大张开，以吸收更多光线。当突然走到光亮地方，瞳孔来不及收缩，所以唯有眯上眼睛，保护视网膜上的视神经。 而电脑是死物，唯有靠HDR技术模拟这效果——人眼自动适应光线变化的能力。方法是快速将光线渲染得非常光亮，然后将亮度逐渐降低。而HDR的最终效果是亮处的效果是鲜亮，而黑暗处的效果是能分辨物体的轮廓和深度，而不是以往的一团黑。 。
       想要实现HDR特效，首先，游戏开发者要在游戏开发过程中，利用开发工具（就是游戏引擎）将实际场景用HDRI记录下来，当然开发技术强的开发组会直接用小开发工具（比如3D MAX的某些特效插件）创造HDRI图像；其次，我们的显卡必须支持显示HDR特效，nVIDIA的显卡必须是GeForce 6系列或更高，ATI显卡至少是Radeon 9550或以上。
       那么HDR与bloom效果的差别到底在什么地方呢？
　　第一，HDR效果就是超亮的光照与超暗的黑暗的某种结合，这个效果是光照产生的，强度、颜色等方面是游戏程序可动态控制的，是一种即时动态光影；bloom效果则是物体本身发出的光照，仅仅是将光照范围调高到过饱和，是游戏程序无法动态控制的，是一种全屏泛光。
　　第二，bloom效果无需HDR就可以实现，但是bloom效果是很受限的，它只支持8位RGBA，而HDR最高支持到32位RGBA。
　　第三，bloom效果的实现很简单，比如《半条命2》的MOD就是一个很小的很简单的MOD，而且bloom效果不受显卡的规格的限制，你甚至可以在TNT显卡上实现bloom效果（当然效果很差）！而HDR，必须是6XXX以上的显卡才能够实现，这里的HDR是指nVIDIA的HDR。这时有必要谈nVIDIA和ATI的显卡所实现的HDR，两者还是有区别的，具体区别就很专业了，总之从真实性表现来看，nVIDIA的显卡实现的HDR更好一些。HDR是nVIDIA提出的概念，从技术上来讲，ATI当然无法严格克隆nVIDIA的技术，所以ATI的HDR是另一种途径实现的尽可能接近的HDR，不能算“真”HDR，据传ATI的R520能够真正实现FP16 HDR。

未使用HDR图像                                                        使用HDR图像


Bloom特效的实现流程
      Bloom效果实现的流程与HDR的物理还原不同，它只是一种简单的近似模拟：
  • 第一步： 先获取屏幕图像，然后对每个像素进行亮度检测，若大于某个阀值即保留原始颜色值，否则置为黑色；
  • 第二步：对上一步获取的图像，做一个模糊，通常使用高斯模糊。
  • 第三步：将模糊后的图片和原图片做一个加权和。
     通过这三步就可以达到一个全屏泛光的效果。



Bloom特效的shader实现

       本例在shader中实现大致和上面所述流程类似，只是在第一步做了少许改动，在这里我们将亮部的像素进行了扩展，关键代码如下：
 
		struct v2f_withMaxCoords {half4 pos : SV_POSITION;half2 uv2[5] : TEXCOORD0;};//在vert函数里对uv坐标做了四次偏移，对原像素周围临近的像素采样v2f_withMaxCoords vertMax (appdata_img v){v2f_withMaxCoords o;o.pos = mul (UNITY_MATRIX_MVP, v.vertex);o.uv2[0] = v.texcoord + _MainTex_TexelSize.xy * half2(1.5,1.5);					o.uv2[1] = v.texcoord + _MainTex_TexelSize.xy * half2(-1.5,1.5);o.uv2[2] = v.texcoord + _MainTex_TexelSize.xy * half2(-1.5,-1.5);o.uv2[3] = v.texcoord + _MainTex_TexelSize.xy * half2(1.5,-1.5);o.uv2[4] = v.texcoord ;return o; }	
//Frag函数用偏移的uv坐标采样，并且与原像素进行对比，如果亮度比原像素大，则取代原像素，因此亮部像素得到了扩展处理。这里ONE_MINUS_INTENSITY是由脚本传递过来的参数，用来控制bloom范围，功能就是讲低于这个值的像素设置为黑色。fixed4 fragMax ( v2f_withMaxCoords i ) : COLOR{				fixed4 color = tex2D(_MainTex, i.uv2[4]);color = max(color, tex2D (_MainTex, i.uv2[0]));	color = max(color, tex2D (_MainTex, i.uv2[1]));	color = max(color, tex2D (_MainTex, i.uv2[2]));	color = max(color, tex2D (_MainTex, i.uv2[3]));	return saturate(color - ONE_MINUS_INTENSITY);}


      流程的第二步就是讲上一步的结果做模糊处理，在这里我们使用的上一个例子所使用的高斯模糊，因此不多做解释，关键代码如下面所示： 

		struct v2f_withBlurCoordsSGX {float4 pos : SV_POSITION;half2 offs[7] : TEXCOORD0;};//水平方向的像素偏移，用来做水平模糊v2f_withBlurCoordsSGX vertBlurHorizontalSGX (appdata_img v){v2f_withBlurCoordsSGX o;o.pos = mul (UNITY_MATRIX_MVP, v.vertex);half2 netFilterWidth = _MainTex_TexelSize.xy * half2(1.0, 0.0) * _Parameter.x; o.offs[0] = v.texcoord + netFilterWidth;o.offs[1] = v.texcoord + netFilterWidth*2.0;o.offs[2] = v.texcoord + netFilterWidth*3.0;o.offs[3] = v.texcoord - netFilterWidth;o.offs[4] = v.texcoord - netFilterWidth*2.0;o.offs[5] = v.texcoord - netFilterWidth*3.0;o.offs[6] = v.texcoord;return o; }		
//垂直方向的像素偏移，用来做水平模糊v2f_withBlurCoordsSGX vertBlurVerticalSGX (appdata_img v){v2f_withBlurCoordsSGX o;o.pos = mul (UNITY_MATRIX_MVP, v.vertex);	half2 netFilterWidth = _MainTex_TexelSize.xy * half2(0.0, 1.0) * _Parameter.x;o.offs[0] = v.texcoord + netFilterWidth;o.offs[1] = v.texcoord + netFilterWidth*2.0;o.offs[2] = v.texcoord + netFilterWidth*3.0;o.offs[3] = v.texcoord - netFilterWidth;o.offs[4] = v.texcoord - netFilterWidth*2.0;o.offs[5] = v.texcoord - netFilterWidth*3.0;o.offs[6] = v.texcoord;return o; }	
//用vert传过来的uv坐标数组进行采样，并乘以对应的权重进行叠加，其结果是个近似高斯模糊。fixed4 fragBlurSGX ( v2f_withBlurCoordsSGX i ) : COLOR{fixed4 color = tex2D(_MainTex, i.offs[6]) * curve[3];color += tex2D(_MainTex, i.offs[0])*curve[2];color += tex2D(_MainTex, i.offs[1])*curve[1];color += tex2D(_MainTex, i.offs[2])*curve[0];color += tex2D(_MainTex, i.offs[3])*curve[2];color += tex2D(_MainTex, i.offs[4])*curve[1];color += tex2D(_MainTex, i.offs[5])*curve[0];return color;}

        流程的最后一步就非常简单了，将上一步获取的结果与原图进行权重求和即可，就能得到一个bloom效果。在这里我们添加了从C#脚本传递过来的权重参数_Parameter.z和颜色参数_ColorMix，用来控制bloom的强度以及颜色倾向。 

		struct v2f_simple {half4 pos : SV_POSITION;half4 uv : TEXCOORD0;};
//考虑到D3D9的uv坐标Y轴是反转的，因此需要做个判断进行调整，防止图像倒转。v2f_simple vertBloom (appdata_img v){v2f_simple o;o.pos = mul (UNITY_MATRIX_MVP, v.vertex);o.uv = v.texcoord.xyxy;			#if SHADER_API_D3D9if (_MainTex_TexelSize.y < 0.0)o.uv.w = 1.0 - o.uv.w;#endifreturn o; }fixed4 fragBloom ( v2f_simple i ) : COLOR{	fixed4 color = tex2D(_MainTex, i.uv.xy);color += tex2D(_Bloom, i.uv.zw)*_Parameter.z*_ColorMix;return color;}
        本例Bloom特效的shader部分关键代码就是这么多，这里就不贴出完整代码了，有需要的同学可以到文章末尾点积链接下载，在完整代码里，我们使用了CGINCLUDE和ENDCG模块化的方式组织代码，减少了一定代码量，并且是代码的可读性更好，方便C#脚本调用。

C#脚本

        C#脚本相对而言比较简单，和前面的的屏幕特效脚本类似，需要对shader的不同pass分别调用，并且开放了四个参数以方便效果的调节：Color Mix控制bloom特效的颜色倾向，Threshold控制bloom效果的范围，Intensity控制bloom特效的强度，Blur Size控制模糊范围以及模糊的质量。关键代码如下；完整代码请到文末放出的链接下载。
 

	void OnRenderImage (RenderTexture sourceTexture, RenderTexture destTexture){	#if UNITY_EDITORFindShaders ();CheckSupport ();CreateMaterials ();	#endifif(threshold != 0 && intensity != 0){int rtW = sourceTexture.width/4;int rtH = sourceTexture.height/4;BloomMaterial.SetColor ("_ColorMix", colorMix);BloomMaterial.SetVector ("_Parameter", new Vector4(BlurSize*1.5f, 0.0f, intensity,0.8f - threshold));	// material.SetFloat("_blurSize",BlurSize);RenderTexture rtTempA = RenderTexture.GetTemporary (rtW, rtH, 0,rtFormat);rtTempA.filterMode = FilterMode.Bilinear;RenderTexture rtTempB = RenderTexture.GetTemporary (rtW, rtH, 0,rtFormat);rtTempA.filterMode = FilterMode.Bilinear;Graphics.Blit (sourceTexture, rtTempA,BloomMaterial,0);Graphics.Blit (rtTempA, rtTempB, BloomMaterial,1);RenderTexture.ReleaseTemporary(rtTempA);rtTempA = RenderTexture.GetTemporary (rtW, rtH, 0, rtFormat);rtTempB.filterMode = FilterMode.Bilinear;Graphics.Blit (rtTempB, rtTempA, BloomMaterial,2);BloomMaterial.SetTexture ("_Bloom", rtTempA);Graphics.Blit (sourceTexture, destTexture, BloomMaterial,3);RenderTexture.ReleaseTemporary(rtTempA);RenderTexture.ReleaseTemporary(rtTempB);}else{Graphics.Blit(sourceTexture, destTexture);}}

本例实现的效果如图

总结

        本例bloom效果是为移动平台开发，做了不少的优化，使之在移动平台上也有不错的效率，当然本例效果还有进一步的优化空间，比如将第一步的像素扩展去掉，可以节省掉4次多余的采样，第二步的高斯模糊同样也可以降阶，甚至也可以换成均值模糊，也能节省不少的计算。


下载链接：

       屏幕特效之Bloom

这篇关于UnityShader实例15:屏幕特效之Bloom的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/1012003。

相关文章

swiper实例

swiper实例

大家好，我是燐子，今天给大家带来swiper实例   微信小程序中的 swiper 组件是一种用于创建滑动视图的容器组件，常用于实现图片轮播、广告展示等效果。它通过一系列的子组件 swiper-item 来定义滑动视图的每一个页面。 基本用法   以下是一个简单的 swiper 示例代码：   WXML（页面结构） <swiper autoplay="true" interval="3
阅读更多...
Java面试题：通过实例说明内连接、左外连接和右外连接的区别

Java面试题：通过实例说明内连接、左外连接和右外连接的区别

在 SQL 中，连接（JOIN）用于在多个表之间组合行。最常用的连接类型是内连接（INNER JOIN）、左外连接（LEFT OUTER JOIN）和右外连接（RIGHT OUTER JOIN）。它们的主要区别在于它们如何处理表之间的匹配和不匹配行。下面是每种连接的详细说明和示例。 表示例 假设有两个表：Customers 和 Orders。 Customers CustomerIDCus
阅读更多...
笔记本电脑屏幕模糊？6招恢复屏幕清晰！

笔记本电脑屏幕模糊？6招恢复屏幕清晰！

在数字化时代的浪潮中，笔记本电脑已成为我们生活、学习和工作中不可或缺的一部分。然而，当那曾经清晰明亮的屏幕逐渐变得模糊不清时，无疑给我们的使用体验蒙上了一层阴影。屏幕模糊不仅影响视觉舒适度，更可能对我们的工作效率和眼睛健康构成威胁。 遇到笔记本电脑屏幕模糊的情况时我们应该如何解决？本文将与大家分享6个简单易懂的解决方法。 方法一：调整Windows分辨率 电脑屏幕模糊显示不清晰怎
阅读更多...
我与Bloom filter

我与Bloom filter

1 海量网页判断用Bloom Filter 面试的时候，一个面试官问我说：“有一个网络爬虫，爬虫程序会不停地爬取页面上的每一个网页，并把爬取后的网页给存储起来，那么爬虫如何判定现在在爬的网页有没有被爬过。” 我当时卡住了半天回答不上来。 面试官给我说用Bloom Filter。 Bloom Filter把爬取过的网页映射到Bloom Filter内，如果再爬取到该网页，Bloom Filt
阅读更多...
如何实现一台机器上运行多个MySQL实例？

如何实现一台机器上运行多个MySQL实例？

在一台机器上一个MySQL服务器运行多个MySQL实例有什么好处？这里我先入为主给大家介绍这样做至少存在两个好处（看完这篇文章后理解会更透彻）： （1）减轻服务器链接负担 （2）为不同的用户提供不同的mysqld服务器的访问权限以方便这些用户进行自我管理。   下面我介绍具体的实现过程： 一、准备工作     台式机一台、Windows系统、MySQL服务器（我安装的版本是MySQL
阅读更多...
Docker Compose--安装Nginx--方法/实例

Docker Compose--安装Nginx--方法/实例

原文网址：Docker Compose--安装Nginx--方法/实例_IT利刃出鞘的博客-CSDN博客 简介 说明 本文介绍Docker Compose如何安装Nginx。 目录结构 ├── config│   ├── cert│   │   ├── xxx_bundle.pem│   │   └── xxx.key│   ├── conf.d│   └── nginx.co
阅读更多...
剑指Offer—编程题15（链表中倒数第k个结点）

剑指Offer—编程题15（链表中倒数第k个结点）

题目：输入一个链表，输出该链表中倒数第k 个结点．为了符合大多数人的习惯，本题从1 开始计数，即链表的尾结点是倒数第1 个结点．例如一个链表有6 个结点，从头结点开始它们的值依次是1 、2、3、4、5 、6。这个个链表的倒数第3 个结点是值为4 的结点． public static class ListNode {int value;ListNode next;} 解题思路：
阅读更多...
用 idea 启动多个实例

用 idea 启动多个实例

在学习负载均衡的时候，要模拟多个实例均提供一个服务，我们要如何用 idea 启动多个实例呢？         如下图，我们已经启动了一个 ProductService 服务，现在想再启动两个相同的服务 1. 选中要启动的服务,右键选择 Copy Configuration... 2 在弹出的框中,选择 Modify options -> Add VM option
阅读更多...
简单工厂模式--结合实例学习简单工厂模式

简单工厂模式--结合实例学习简单工厂模式

在讲解简单工厂模式之前，有必要先了解一下OO的一些原则  1.OCP（开闭原则，Open-Closed Principle）：一个软件的实体应当对扩展开放，对修改关闭。也就是说，对于一个已有的软件，如果需要扩展，应当在不需修改      已有代码的基础上进行。   2.DIP（依赖倒转原则，Dependence Inversion Principle）：要针对接口编程，不要针对实现编程。简单点说
阅读更多...
Struts2(一)---struts2的环境搭建及实例

Struts2(一)---struts2的环境搭建及实例

刚刚接触struts2，有点懵懵懂懂，还是习惯于先写代码，然后慢慢来理解其中的思想。 这篇文章主要内容是strusts的环境搭建及通过一个简单的例子来理解到底是怎么使用struts来简化编程的。 1.项目结构如下如，包括必须的包 2.web.xml <?xml version="1.0" encoding="UTF-8"?><web-app version="3.0" xmlns="
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2