Unity shader 带边缘溶解效果

最新推荐文章于 2024-12-10 22:53:18 发布

原创

最新推荐文章于 2024-12-10 22:53:18 发布 · 2.7k 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#游戏开发 #游戏 #3d渲染

这篇博客介绍了如何在Unity中实现带边缘溶解效果的Shader。通过使用溶解纹理和设定阈值，达到图片渐隐渐现的效果。同时，通过调整宽度值，实现边缘颜色可控。虽然不如Bloom后处理效果柔和，但性能消耗更低，适用于手游项目。最后展示了实现效果。

原理

实现

效果

最近项目美术需要使用一个带边缘效果的溶解，就顺便记录分享一下。

美术的需求是，在溶解的基础上，可以有一个边缘，边缘可以调节颜色。

因为是手游项目所以没有考虑使用bloom的后处理去柔和边缘。

原理

1.溶解：

使用一张溶解纹理，并在shader中设置一个阈值。

shader中读取该纹理的alpha值(或者其他任何颜色通道的值也可以)，当alpha值大于阈值的时候就在fragment shader中剔除该像素。

最终美术通过修改阈值将看到原来的图片随着溶解纹理逐渐的消失或者出现。

2.边缘：

在溶解的基础上增加一个宽度值。

最终在fragment shader中剔除的像素为溶解纹理中alpha值大于(阈值+宽度)的像素。而阈值到宽度之间的那些像素使用新的颜色(即边缘颜色)来替代，小于阈值的那些像素使用主纹理自身的颜色。

实现

Shader "Custom/Disolve"
{
    Properties
    {
        _MainTex ("主纹理", 2D) = "white" {}
        _DisolveTex ("溶解纹理", 2D) = "white" {}
        _Degree ("溶解程度", Range(0,1.01)) = 0.5
        _Width ("光圈宽度", Range(0,1)) = 0.2
        _OutCol ("光圈颜色", Color) = (1,1,1,1)
    }
    SubShader
    {
        Pass
        {
            ZWrite Off
            Blend SrcAlph