Shader——精灵表单动画

作者:追风剑情 发布于:2015-9-6 20:56 分类:Shader

一、准备一张精灵表单图片

flower.png

二、创建shader


  1. Shader "Custom/SpriteSheet" {
  2. Properties {
  3. _MainTex ("Base (RGB)", 2D) = "white" {}
  4. _TexWidth ("Sheet Width", float) = 0.0
  5. _CellAmount ("Cell Amount", float) = 0.0
  6. _Speed ("Speed", Range(0.01, 32)) = 12
  7. }
  8. SubShader {
  9. Tags { "RenderType"="Opaque" }
  10. LOD 200
  11. CGPROGRAM
  12. #pragma surface surf Lambert
  13.  
  14. sampler2D _MainTex;
  15. float _TexWidth;
  16. float _CellAmount;
  17. float _Speed;
  18.  
  19. struct Input {
  20. float2 uv_MainTex;
  21. };
  22.  
  23. void surf (Input IN, inout SurfaceOutput o) {
  24. float2 spriteUV = IN.uv_MainTex;
  25. float cellPixelWidth = _TexWidth/_CellAmount;
  26. float cellUVPercentage = cellPixelWidth/_TexWidth;
  27. //fmod(x,y) : 取模,如果y为0结果不可预料。
  28. float timeVal = fmod(_Time.y * _Speed, _CellAmount);
  29. timeVal = ceil(timeVal);//向上取整
  30. float xValue = spriteUV.x;
  31. xValue += cellUVPercentage * timeVal * _CellAmount;
  32. xValue *= cellUVPercentage;
  33. spriteUV = float2(xValue, spriteUV.y);
  34. half4 c = tex2D (_MainTex, spriteUV);
  35. o.Albedo = c.rgb;
  36. o.Alpha = c.a;
  37. }
  38. ENDCG
  39. }
  40. FallBack "Diffuse"
  41. }


三、运行效果

s1.png


s2.png

四、优化建议

把时间计算放到C#中进行。


  1. void FixedUpdate(){
  2. timeValue = Mathf.Ceil(Time.time%16);
  3. transform.renderer.material.SetFloat("_TimeValue", timeValue);
  4. }


示例二:精灵表单Shader

22222.png

33333.png

Shader代码

  1. Shader "Custom/SpriteSheet" {
  2. Properties{
  3. _MainTex("Base (RGB)", 2D) = "white" {}
  4. _HorizontalAmount("Horizontal Amount", float) = 0.0
  5. _VerticalAmount("Vertical Amount", float) = 0.0
  6. _Speed("Speed", Range(0.01, 32)) = 12
  7. _TransVal("Transparency Value", Range(0, 1)) = 1
  8. }
  9. SubShader{
  10. Tags {"Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent"}
  11. LOD 400
  12. Blend SrcAlpha OneMinusSrcAlpha
  13.  
  14. CGPROGRAM
  15. #pragma surface surf Lambert alpha
  16.  
  17. sampler2D _MainTex;
  18. float _HorizontalAmount;
  19. float _VerticalAmount;
  20. float _Speed;
  21. float _TransVal;
  22.  
  23. struct Input {
  24. float2 uv_MainTex;
  25. };
  26.  
  27. void surf(Input IN, inout SurfaceOutput o) {
  28. float2 spriteUV = IN.uv_MainTex;
  29.  
  30. //fmod(x,y) : 取模,如果y为0结果不可预料。
  31. //floor(x) : 向下取整
  32. //_Time.y : 自场景加载开始所经过的时间 (单位:秒)
  33.  
  34. float time = floor(_Time.y * _Speed);
  35. //行
  36. float row = floor(time / _HorizontalAmount);
  37. //列
  38. float column = floor(fmod(time, _HorizontalAmount));
  39.  
  40. //定位到当前要显示的帧
  41. spriteUV.x += column;
  42. spriteUV.y -= row;
  43.  
  44. //将UV的取值范围缩小到每一帧上
  45. spriteUV.x /= _HorizontalAmount;
  46. spriteUV.y /= _VerticalAmount;
  47.  
  48. half4 c = tex2D(_MainTex, spriteUV);
  49. //漫反射颜色
  50. o.Albedo = c.rgb;
  51. //自发光颜色
  52. o.Emission = c.rgb;
  53. //用灰度值做为alpha
  54. o.Alpha = (c.r * 0.299 + c.g * 0.587 + c.b * 0.114) * _TransVal;
  55. }
  56. ENDCG
  57. }
  58. FallBack "Diffuse"
  59. }

运行效果

11111.gif

标签: Shader

Powered by emlog  蜀ICP备18021003号-1   sitemap

川公网安备 51019002001593号