Unity引导路径箭头Shader


前言

看了大佬恬静小魔龙的帖子,正好有这个需求,然后复制过来使用,但是发现,复制过来后,箭头导向的路径中,只有一个箭头,这显然不能满足我当下的需求,所以改了一下Shader。


先看改进后的效果

在这里插入图片描述

一、修改的内容

1.大佬的Shader中 Properties只有两个属性:_MainTex和_ScrollYSpeed。
我增加了一个属性:_ScrollYMultiplier

o.uv = v.uv * float2(1, _ScrollYMultiplier);

这段代码将原始的纹理坐标v.uv与_ScrollYMultiplier相乘,实现了纵向纹理坐标的缩放。
2.还在frag函数中,增加了以下代码:

uv.y -= _ScrollYSpeed * _Time;
uv.y -= floor(uv.y) / _ScrollYMultiplier;
uv.y = frac(uv.y * _ScrollYMultiplier);

这段代码对纵向纹理坐标进行了调整,实现了纹理在Y轴上的滚动效果,并且根据_ScrollYMultiplier进行了调整。

总结来说:我在纹理坐标的处理上增加了_ScrollYMultiplier属性,使纹理在Y轴方向上可以根据这个属性进行缩放,同时也增加了更复杂的纵向滚动效果的计算。

二、具体代码

现在可以通过暴露出来的两个值,去调整移动的前进和后退,还可以调整数量、缩放;

具体代码如下:

Shader "Custom/NavPathArrow"
{
    Properties
    {
        _MainTex("Texture", 2D) = "white" {}
        _ScrollYSpeed("Y Scroll Speed", Range(-20, 20)) = 2
        _ScrollYMultiplier("Y Scroll Multiplier", Range(1, 10)) = 1
    }

        SubShader
        {
            Tags { "Queue" = "Transparent" "RenderType" = "Transparent" }
            LOD 100
            Cull Off
            Blend SrcAlpha OneMinusSrcAlpha

            Pass
            {
                CGPROGRAM
                #pragma vertex vert
                #pragma fragment frag

                #include "UnityCG.cginc"

                struct appdata
                {
                    float4 vertex : POSITION;
                    float2 uv : TEXCOORD0;
                };

                struct v2f
                {
                    float2 uv : TEXCOORD0;
                    float4 vertex : SV_POSITION;
                };

                sampler2D _MainTex;
                float4 _MainTex_ST;
                fixed _ScrollYSpeed;
                float _ScrollYMultiplier;

                v2f vert(appdata v)
                {
                    v2f o;
                    o.vertex = UnityObjectToClipPos(v.vertex);
                    o.uv = v.uv * float2(1, _ScrollYMultiplier);
                    return o;
                }

                fixed4 frag(v2f i) : SV_Target
                {
                    fixed2 uv = i.uv;
                    uv.y -= _ScrollYSpeed * _Time;
                    uv.y -= floor(uv.y) / _ScrollYMultiplier;
                    uv.y = frac(uv.y * _ScrollYMultiplier);

                    fixed4 col = tex2D(_MainTex, uv);
                    return col;
                }
                ENDCG
            }
        }
}


总结

此教程根据恬静的小魔龙大佬代码进行改进
原链接:https://blog.youkuaiyun.com/q764424567/article/details/123811819?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522169035848016800182774737%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=169035848016800182774737&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2blogfirst_rank_ecpm_v1~rank_v31_ecpm-2-123811819-null-null.268v1koosearch&utm_term=%E5%AF%BC%E8%88%AA&spm=1018.2226.3001.4450

图片源文件我也放一个 以后备用
在这里插入图片描述

### Unity 中实现箭头流动效果的 Shader 为了创建具有流动效果的箭头,在 Unity 的着色器中可以通过调整 UV 坐标来模拟这种视觉现象。下面是一个基于给定资料构建的具体方法。 #### 定义属性与标签 首先定义材质所需的参数,包括纹理资源以及用于控制动画速率的速度变量: ```csharp Shader "Custom/FlowingArrow" { Properties { _MainTex ("Texture", 2D) = "white" {} _MoveSpeed("Move Speed", Float) = 1.0 // 移动速度 } SubShader { Tags {"Queue"="Transparent" "RenderType"="Opaque"} LOD 100 Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag struct appdata_t { float4 vertex : POSITION; float2 uv : TEXCOORD0; }; struct v2f { float2 uv : TEXCOORD0; float4 pos : SV_POSITION; }; sampler2D _MainTex; float _MoveSpeed; v2f vert (appdata_t v) { v2f o; o.pos = UnityObjectToClipPos(v.vertex); // 计算时间偏移量影响UV坐标 o.uv = TRANSFORM_TEX(v.uv, _MainTex); o.uv.x += sin(_Time.y * _MoveSpeed + v.uv.y * 6.28318530718) / 4; // 添加水平方向上的波动 return o; } fixed4 frag (v2f i) : SV_Target { // 应用纹理采样并返回颜色值 fixed4 col = tex2D(_MainTex, i.uv); clip(col.a - 0.1); // 设置透明度阈值以获得更清晰边缘 return col; } ENDCG } } } ``` 此段代码通过改变顶点函数中的 `o.uv` 来引入随时间变化的位置偏移,从而制造出一种沿着特定路径前进的感觉[^1]。此外,还加入了简单的正弦波形扰动让运动看起来更加自然流畅[^4]。 对于希望进一步增强效果的情况,可以考虑结合其他技术如法线映射(normal mapping),或是探索更多复杂的光照模型来提升整体表现力。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

_济南橙子

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值