图片UI动效——流光加载进度条
- 源代码：
- Shader：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86Shader "Unlit/RotationShader"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_Rotation ("Rotation", Range(0, 90)) = 0
[hideInInspector] _OffsetX ("OffsetX", Float) = 0 // _OffsetX = _PosX - _Width * 0.5;
[hideInInspector] _UVOffset ("UVOffset", Float) = 0
_UVScale ("UVScale", Range(0, 1)) = 0.01
_FlowSpeed ("FlowSpeed", Float) = -3
[hideInInspector] _BlendAmount ("BlendAmount", Range(0, 1)) = 0 // 0 Flowing 1 Solid color
[hideInInspector] _SolidColor ("SolidColor", Color) = (0, 0, 0, 1)
}
SubShader
{
Tags { "RenderType"="Transparent" "Queue"="Transparent"}
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;
float _Rotation;
float _OffsetX;
float _UVScale;
float _UVOffset;
float _FlowSpeed;
float _BlendAmount;
float4 _SolidColor;
float4x4 M_Rotate()
{
return float4x4(cos(radians(_Rotation)), -sin(radians(_Rotation)), 0, 0,
sin(radians(_Rotation)), cos(radians(_Rotation)), 0, 0,
0, 0, 1, 0,
0, 0, 0, 1);
}
v2f vert (appdata v)
{
v2f o;
// uvScale
v.uv *= _UVScale;
// uvFlow
v.uv.x += _Time.x * _FlowSpeed;
// Rotate
v.vertex.x -= _OffsetX;
v.vertex = mul(M_Rotate(), v.vertex);
v.vertex.x += _OffsetX;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = TRANSFORM_TEX(v.uv, _MainTex);
return o;
}
fixed4 frag (v2f i) : SV_Target
{
float uv_x = i.uv.x + _UVOffset;
fixed4 col = tex2D(_MainTex, uv_x);
col = (1 - _BlendAmount) * col + _BlendAmount * _SolidColor;
return col;
}
ENDCG
}
}
} - C#：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45using DG.Tweening;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class SliderControl : MonoBehaviour
{
private List<Material> materials = new List<Material>();
private Sequence sequence;
[SerializeField, Header("单个旋转总时长")] private float time_rot = 2f;
[SerializeField, Header("淡出纯色")] private Color solidColorOut;
[SerializeField, Header("淡入纯色")] private Color solidColorIn;
[SerializeField] private float stayTime = 2f;
void Start()
{
for (int i = 0; i < transform.childCount; i++)
{
transform.GetChild(i).GetComponent<Image>().material = new Material(transform.GetChild(i).GetComponent<Image>().material);
materials.Add(transform.GetChild(i).GetComponent<Image>().material);
materials[i].SetFloat("_OffsetX", transform.GetChild(i).GetComponent<RectTransform>().localPosition.x - transform.GetChild(i).GetComponent<RectTransform>().sizeDelta.x / 2f);
materials[i].SetFloat("_UVOffset", materials[i].GetFloat("_UVScale") * (transform.GetChild(i).GetComponent<RectTransform>().localPosition.x - transform.GetChild(0).GetComponent<RectTransform>().localPosition.x) / transform.GetChild(0).GetComponent<RectTransform>().sizeDelta.x);
}
sequence = DOTween.Sequence().SetUpdate(true).SetId(transform);
for (int i = 0; i < transform.childCount; i++)
{
sequence.Insert(time_rot / transform.childCount * i, materials[i].DOFloat(90f, "_Rotation", time_rot))
.Insert(time_rot / transform.childCount * i, materials[i].DOColor(solidColorOut, "_SolidColor", 0))
.Insert(time_rot / transform.childCount * i, materials[i].DOFloat(1f, "_BlendAmount", time_rot))
.Insert(time_rot / transform.childCount * i + time_rot + stayTime, materials[i].DOColor(solidColorIn, "_SolidColor", 0))
.Insert(time_rot / transform.childCount * i + time_rot + stayTime * 2, materials[i].DOFloat(0, "_Rotation", time_rot))
.Insert(time_rot / transform.childCount * i + 0.5f + stayTime * 2 + time_rot, materials[i].DOFloat(0, "_BlendAmount", 0.5f));
}
sequence.AppendInterval(stayTime).SetLoops(-1);
}
private void OnDestroy()
{
DOTween.Kill(transform);
}
}