效果:

序列帧图片网上随便找的,质量不是很好,重点不是它,不要在意。

思路:
1.之前都是在一张面片上直接映射一张纹理,IN.uv的范围是0~1
现在要映射一张纹理上的一小块区域,就要用这块区域的uv去采样后映射到面片。
所以:x方向,IN.uv.x/列数,范围变化到0~(1/列数)
同理:y方向,IN.uv.y/行数,范围变化到0~(1/行数)

2.根据时间驱动,加上当前sprite的偏移量
uv.x = cellX + SpriteColumnIndex*1.0 / _Column;
uv.y = cellY + SpriteRowIndx*1.0 / _Row;

3.用变换后的uv去采样图片
half4 c = tex2D(_MainTex,uv);

代码有注释:

Shader "Custom/SpriteAnimation"
{
Properties
{
_MainTex("main tex" ,2D) = ""{}
_Row("行",Int) =
_Column("列",Int) =
_Speed("speed",Range(,)) =
} SubShader
{
Tags{ "RenderType" = "Transparent" "Queue" = "Transparent" } Pass
{
Blend One OneMinusSrcAlpha
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc" struct v2f
{
float4 pos:POSITION;
float2 uv:TEXCOORD0;
}; sampler2D _MainTex;
float4 _MainTex_ST; int _Row;
int _Column;
float _Speed; v2f vert(appdata_base v)
{
v2f o;
o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
o.uv = TRANSFORM_TEX(v.texcoord,_MainTex);
return o;
} half4 frag(v2f IN) :COLOR
{
float2 uv = IN.uv; float cellX = uv.x / _Column;
float cellY = uv.y / _Row; //Sprite总数
int count = _Row * _Column; //在0到count-1 范围内循环
int SpriteIndex = fmod(_Time.w*_Speed,count); //当前Sprite所在行的下标
int SpriteRowIndx = (SpriteIndex / _Column); //当前Sprite所在列的下标
int SpriteColumnIndex = fmod(SpriteIndex,_Column); //因uv坐标左下角为(0,0),第一行为最底下一行,为了合乎我们常理,我们转换到最上面一行为第一行,eg:0,1,2-->2,1,0
SpriteRowIndx = (_Row - ) - fmod(SpriteRowIndx,_Row); //乘以1.0转为浮点数,不然加号右边,整数除以整数,还是整数(有误)
uv.x = cellX + SpriteColumnIndex*1.0 / _Column;
uv.y = cellY + SpriteRowIndx*1.0 / _Row; half4 c = tex2D(_MainTex,uv);
return c;
}
ENDCG
}
}
FallBack "Diffuse"
}

Shader实例:序列帧动画的更多相关文章

  1. Unity Shader播放序列帧动画

    Shader "LordShader/AnimateSprite" { Properties { _MainTint (,,,) //颜色属性,可以在u3d inspector面板 ...

  2. Unity Shader序列帧动画学习笔记

    Unity Shader序列帧动画学习笔记 关于无限播放序列帧动画的一点问题 在学shader的序列帧动画时,书上写了这样一段代码: fixed4 frag(v2f i){ // 获得整数时间 flo ...

  3. unity shader序列帧动画代码,顺便吐槽一下unity shader系统

    一.看到UNITY论坛里有些人求unity shader序列帧动画,写shader我擅长啊,就顺势写了个CG的shader.代码很简单,就是变换UV采样序列帧贴图,美术配置行数列数以及变换速度. Sh ...

  4. Unity Shader 序列帧动画

    shader中的序列帧动画属于纹理动画中的一种,主要原理是将给定的纹理进行等分,再根据时间的变化循环播放等分中的一部分. Unity Shader 内置时间变量 名称 类型 描述 _Time floa ...

  5. cocos2d-x 2.0 序列帧动画 深入分析

    转自:http://blog.csdn.net/honghaier/article/details/8222401 序列帧动画主要有几个类: CCSpriteFrame:精灵帧信息,序列帧动画是依靠多 ...

  6. [Cocos2d-x v3.x]序列帧动画

      简单介绍 Cocos2d-x中.动画的详细内容是依靠精灵显示出来的,为了显示动态图片,我们须要不停切换精灵显示的内容.通过把静态的精灵变为动画播放器从而实现动画效果. 动画由帧组成,每一帧都是一个 ...

  7. iOS开发基础-序列帧动画之Tom猫

    新建一个Single View Application,向该工程中导入Tom猫的图片资源,本示例演示Tom猫喝牛奶的动作.图片的名字为 drink_00.jpg.drink_01.jpg.....dr ...

  8. UnityShader 序列帧动画效果

    实现原理:主要思想是设置显示uv纹理的大小,并逐帧修改图片的uv坐标. 实现步骤 1.我们首先用_Time.y和速度属性_Speed相乘得到模拟的时间. 2.然后我们用time除以_Horizonta ...

  9. Unity Shader 之 uv动画

    Unity 动画 Unity Shader 内置时间变量 引入时间变量 名称 类型 描述 _Time float4 t是自该场景加载开始所经过的时间,4个分量分别是(t/20, t, 2t, 3t) ...

随机推荐

  1. android onCreate中获取view宽高为0的解决方法

    view.post(runnable) 通过post可以将一个runnable投递到消息队列的尾部,然后等待UI线程Looper调用此runnable的时候,view也已经初始化好了. view.po ...

  2. sss

    function handleTouchEvent(event) {    if (event.touches.length == 1) {        var output = document. ...

  3. 天河微信小程序入门《三》:打通任督二脉,前后台互通

    原文链接:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=505&extra=page%3D1 天河君在申请到https ...

  4. 【openStack】Libcloud 如何支持 keystone V3?

    Examples This section includes some examples which show how to use the newly available functionality ...

  5. Mysql 存储引擎中InnoDB与Myisam的主要区别

    一直以为我spring事物没有配置好,结果发现是mysql的表本身设置成了Myisam 引擎.改成innodb就支持事物了. 1, 事务处理 innodb 支持事务功能,myisam 不支持. Myi ...

  6. 第3章 拍摄UFO——单一职责原则

    就一个类而言,应该仅有一个引起它变化的原因

  7. dreamweaver cs6 mac破解版

    http://www.sdifenzhou.com/dreamweaver-cs6-mac.html

  8. struts2 No result defined for action XXX and result input

    这种错误的原因一般是页面的属性和action里的属性个数.名称.类型不一致造成的 困扰了我一下午的问题,原来是表单中有两个input-text的name属性重复了,然后接受参数的时候就出现了这个错误 ...

  9. cnentos中进行bond网卡配置,一切配置无问题,就是ping不通宿主机

    服务器网口绑定   1. ifcfg-bond0   DEVICE=bond0 ONBOOT=yes IPADDR=192.168.100.64 NETMASK=255.255.255.0   2. ...

  10. freemarker 中文乱码

    <bean id="freemarkerConfig" class="org.springframework.web.servlet.view.freemarker ...