宝可梦游戏在进入战斗前会有类似这样转场动画。
例子中使用的纹理质量较差,边缘比较模糊,和shader无关。
这个UI是盖在所有UI最前面的。可以使用shader来完成这个工作,而不是复杂的动画。
使用一张这样的灰度图,用动画控制cutoff值来决定产生遮罩的像素从而产生动画。
Shader 代码如下:
Shader "UI/UITransitions"
{
// 通过材质可以控制的变量,使用inspector设置
Properties
{
_MainTex("Texture", 2D) = "white" {}
_TransitionTex("Transition Texture", 2D) = "white" {}
_Color("Screen Color", Color) = (1,1,1,1)
_Cutoff("Cutoff", Range(0, 1)) = 0
_Fade("Fade", Range(0, 1)) = 0
}
// 对应多个变体。如:一个subshader给pc用,另一个给手机用
SubShader
{
// 不剪切背表面、不写z、ztest永远通过
Cull Off ZWrite Off ZTest Always
// 每个pass会渲染一次物体。如:一个pass处理平行光&#x