Unity ShaderGraph 实现 Gradients 渐变 (2D)

作者:Pixierr
2020-05-04
12 6 0

在开发《Anchor》的时候发现 Unity 暂时不支持在代码中直接替换 gradient,且无法 expose 在 inspector 中,因此想出个笨办法来解决。另在 shader 中做了大于 2 色的 gradient。

Overview

  1. Sprite Unlit Master
  2. 用 Shader 创建 Material 并应用在 sprite 上
  3. shader 一共三个部分:Original GradientTarget GradientLerp Control

Overview

Gradient

  1. OriginalTarget 一样
  2. gradientcolorkey 个数可以自行添加更多 Lerp Node

Gradient

Lerp Control

  1. LerpStatus 可以看作是 A 到 B 的百分比进度,被限制在 01 之间,可以按需修改成 Time Node

Lerp Control

属性总览

代码

  1. 随便放在谁身上,inspector 中调好想要的 gradients
  2. 测试用,写的粗糙了点


public SpriteRenderer spriteRenderer;

//Inspector 中自己设置的 Gradients
public Gradient gradientOriginal;  
public Gradient gradientTarget;

//储存 colorkeys 的 list
List<Color> originalColors = new List<Color>(); 
List<Color> targetColors = new List<Color>();

//括号内红字是 Property 的名字,按上图
private static readonly int OriginalTop = Shader.PropertyToID("Color_EED7677C");
private static readonly int OriginalMid = Shader.PropertyToID("Color_73BE25BF");
private static readonly int OriginalBottom = Shader.PropertyToID("Color_D936B97");
private static readonly int TargetTop = Shader.PropertyToID("Color_A1B04C9A");
private static readonly int TargetMid = Shader.PropertyToID("Color_D4C6EBC5");
private static readonly int TargetBottom = Shader.PropertyToID("Color_5127E8E4");

private void Start()
{
    foreach (var gradientColorKey in gradientOriginal.colorKeys)
    {
        originalColors.Add(gradientColorKey.color);
    }
    foreach (var gradientColorKey in gradientTarget.colorKeys)
    {
        targetColors.Add(gradientColorKey.color);
    }
    
    //设置 shader 中的 gradient 颜色
    spriteRenderer.material.SetColor(OriginalTop, originalColors[2]);
    spriteRenderer.material.SetColor(OriginalMid, originalColors[1]);
    spriteRenderer.material.SetColor(OriginalBottom, originalColors[0]);
    spriteRenderer.material.SetColor(TargetTop, targetColors[2]);
    spriteRenderer.material.SetColor(TargetMid, targetColors[1]);
    spriteRenderer.material.SetColor(TargetBottom, targetColors[0]);

}

//测试用
//控制 Lerp 的进度
private void Update()
{
    if (Input.GetKey(KeyCode.UpArrow))
    {
        spriteRenderer.material.SetFloat(LerpControl,
            spriteRenderer.material.GetFloat(LerpControl) + .01f);
    }
    
    if (Input.GetKey(KeyCode.DownArrow))
    {
        spriteRenderer.material.SetFloat(LerpControl,
            spriteRenderer.material.GetFloat(LerpControl) - .01f);
    }
}

最终效果

Result

本文为用户投稿,不代表 indienova 观点。

近期点赞的会员

 分享这篇文章

您可能还会对这些文章感兴趣

参与此文章的讨论

暂无关于此文章的评论。

您需要登录或者注册后才能发表评论

登录/注册