Sorry, your browser cannot access this site
This page requires browser support (enable) JavaScript
Learn more >

学习透明的必备知识

一、重要知识回顾

回顾 SubShander 中的具体构成内容部分 2024-09-10 110541.png

二、渲染顺序的重要性

1.深度测试和深度写入带来的好处

有了深度测试和深度写入发挥作用 让我们不需要去关心不透明物体的渲染顺序

例如: 2024-09-10 111312.png
一个物体 A 挡住了物体 B
即使底层逻辑中 先渲染 A,后渲染 B,我们也不用担心 B 的颜色会把 A 覆盖
因为在进行深度测试时,远处的 B 的深度值无法通过深度测试
因为它的深度会比已经写入深度缓冲中 A 的深度值大重合处的片元会被丢弃,颜色自然就不会写入,
最终重叠处渲染出来的会是 A 的颜色

我们之前写的所有 Shader 都没有刻意的去设置深度测试(默认小于判断)、深度写入(默认开启)混合模式(默认不混合)、 渲染队列(默认几何队列) 相关内容
是因为对于不透明的物体来说,使用默认设置就能够得到正确的渲染效果
但目前我们将要学习的透明相关知识,就需要对他们进行改变其中,
最最最重要的改变就是处理透明混合时,需要关闭深度写入

三、透明混合为什么要关闭深度写入


在图形学中模拟出现实世界的半透明效果是通过将多个颜色进行混合计算呈现出来的、
举例:
下图来说
2024-09-10 111904.png
如果前方的 A 对象不关闭深度写入,那么 B 被 A 遮挡的部分会在深度测试时被舍弃(因为 A 离摄像机更近深度更小)那么我们就无法得到被遮挡部分的颜色,也就无法进行颜色的混合计算
因此我们必须关闭透明物体的深度写入让其不会导致被遮挡物体无法通过深度测试从而无法进行颜色混合

四、关闭深度写带来的一些问题


若关闭深度写入,
那么物体的渲染顺序就会变得非常的重要谁先被渲染,谁后被渲染都会影响最终的呈现效果
我们举例说明

1.事例一


两个物体 A 为半透明物体 B 为不透明物体
2024-09-10 112256.png
两种可能的渲染顺序

  • 第一种:先渲染 B,再渲染 A,可以得到正确的半透明效果
  • 第二种:先渲染 A,再渲染 B,只会看到 B 的颜色


从这个例子我们看出,想要得到正确的半透明混合效果
先渲染不透明物体,再渲染透明物体

2.事例二


两个物体 A B 都为半透明物体
2024-09-10 112640.png
两种可能的渲染顺序

  • 第一种:先渲染 B,再渲染 A,得到正确的半透明效果
  • 第二种:先渲染 A,再渲染 B,得到错误的半透明效果(B 在前)

从这个例子我们看出,想要得到正确的半透明混合效果 半透明物体之间也需要正确的渲染顺序才能得到正确结果

五、如何解决渲染顺序问题

1.常规方法

  1. 先渲染不透明物体 开启它们的深度测试和深度写入
  2. 将半透明物体按照距离摄像机的远近进行排序(基于物体),然后从后往前的顺序渲染他们 开启深度测试关闭深度写入

2.特殊形况

2024-09-10 113923.png 解决方法:

  1. 忍着
  2. 从模型入手:拆分模型
  3. 使用开启深度写入的半透明效果来模拟半透明(性能消耗较高)

六、设置深度写入和渲染队列

1.深度写入

2024-09-10 114412.png
深度写入默认是开启的
我们需要通过渲染状态中的 ZWrite off 指令
主动关闭深度写入

  • 当我们把它写在 Pass 渲染通道中时,它只会影响该 Pass
  • 若我们把它写在 SubShader 语句块中,它将影响其中的所有 Pass

2.渲染队列

2024-09-10 114754.png 2024-09-10 115043.png 2024-09-10 115058.png 2024-09-10 115105.png

七、设置混合命令


混合默认是关闭的
当我使用 Blend 混合命令时(除了 Blend Off 外),Unity 内部就会自动的帮助我们开启混合
我们在实现透明效果时,就需要设置混合方式这个状态

八、混合理论

1.混合的基本原理


当我们在进行渲染时,当片元通过了深度测试后,会进入到混合流程中。
在混合流程中

  • 当前片元的颜色成为源颜色
  • 颜色缓冲区的颜色称为目标颜色

混合就是将 源颜色和目标颜色 用对应的混合算法进行计算 输出到一个新的颜色 更新到颜色缓冲区当中

注意: 这些颜色都是 RGBA ,包含透明通道 A

2.混合的计算规则

2024-09-11 160506.png

1. 设置混合操作

使用 BlendOP 混合操作 来设置混合的计算方式

2024-09-11 160331.png

2.设置混合因子

2024-09-11 160600.png
2024-09-11 160648.png

3.常见的混合类型

2024-09-11 160748.png

评论