Unity使用ShaderGragh制作透明指针

1 概述

Shader动画,有时候比Transform的动画更加高效

1 不会像正常对象操作Transform额外占用一个Batches
2 HDRP的Shader去掉 Receieve Decal 属性可以节约一个Batches,默认是两个Batches

2 使用环境

Unity 2021.3 + HDRP管线

3 制作流程

3.1 创建一个ShaderGragh

右键单击,创建一个ShaderGragh【根据当前使用的管线,创建后可以继续调整】

优点:可以创建多个管线的Shader资源,方便切换或者升级管线
节点式的编辑器,类似UE的蓝图编辑器,可视化编程比较直观,暴露参数简单

在这里插入图片描述

3.2 打开ShaderGraph编辑器

点击创建的Shader,选择Open Shader Editor,打开ShaderGraph编辑器
在这里插入图片描述

3.3 编辑器界面介绍

左侧菜单如下:
Save Asset – 保存资源 [点击保存按钮后,Shader才会进行编译操作,否则不会有变化!]
Save As – 另存为
Show In Project – 在Porject文件夹高亮
在这里插入图片描述

右侧菜单如下:
ColorMode – 当前节点的预览颜色
Blackboard – 暴露参数的面板
Graph Inspector – 细节面板,查看节点和Shader的信息、编辑参数
MainPreview – 材质效果预览面板

一些Blackboard下的参数新增后默认值为0,颜色默认分为黑色,可以修改到合适的值,比如默认白色。

在这里插入图片描述

3.4 Shader节点和部分信息如下

锚点参数:0.5,0.5
平铺控制:1,1
偏移控制:0,0
颜色控制:白色
透明度:1

在这里插入图片描述

在这里插入图片描述

3.5 常用节点介绍

旋转节点【Rotate】:对UV进行操作,旋转贴图
平铺和偏移节点【TilingAndOffset】:对UV进行操作,平铺或者平移贴图
乘法节点【Multiply】:对贴图进行一个颜色叠加

编辑器内部,点击右键创建节点【CreateNode】,具有搜索功能

3.6 使用Shader

首先新建材质,然后找到ShaderGraph下的RotateShader,点击选择即可。
请添加图片描述

3.7 贴图规范

有一句话叫做:黑透白不透。
利用黑底贴图做底,其他部件使用白色,Shader透明类型选择Additive,即可完美剔除黑色部分。

问:白色部分调节颜色变成黑色会完全透明,怎么做才能获得黑色效果?
答:颜色不动,将Alpha值调成-1即可。

以下是两个Mesh的Shader叠加效果
在这里插入图片描述
这里做了一个透明底黑箭头的贴图【错误】做对比,效果很不理想。
在这里插入图片描述
两种贴图的对比:
左侧:正确;
右侧:错误;
在这里插入图片描述

4 控制Shader旋转

4.1 API介绍

主要使用函数 material.SetFloat(Key_Angle, angle_);
Key对应ShaderGraph的暴露变量的Reference字段,创建变量后会自动分配,也可以自行修改,如下图所示:
在这里插入图片描述

4.2 示例代码:

using UnityEngine;

public class SG_Rotate : MonoBehaviour
{
    
    
	/// <summary>
	/// Shader - Key引用
	/// </summary>
	public static string Key_Angle = "_FE_Angle";

	[Header("仪表材质")]
	public Material material;

	[Header("指针角度")]
	public float Angle;

	[Header("顺时针转动")]
	public bool IsRight = false;


    void Update()
    {
    
    
		Angle += 10 * Time.deltaTime;

		if(Angle >= 360 || Angle <= -360)
		{
    
    
			Angle= 0;
		}

		SetAngle_(Angle, IsRight);
	}

	void SetAngle(float angle_)
	{
    
    
		Angle = angle_;

		SetAngle_(Angle, IsRight);
	}

	void SetAngle_(float angle_, bool isRight)
	{
    
    
		if (!material)
		{
    
    
			return;
		}

		if (isRight)
		{
    
    
			angle_ = -angle_;
		}

		material.SetFloat(Key_Angle, angle_);
	}
}

3.9 Shader Demo资源下载

透明Shader指针旋转动画

猜你喜欢

转载自blog.csdn.net/weixin_38531633/article/details/130113166