Shader实例:序列帧动画
效果:


序列帧图片网上随便找的,质量不是很好,重点不是它,不要在意。
思路:
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"
}
- 本文固定链接: http://www.shihuanjue.com/?p=297
- 转载请注明: 乔 2016年01月16日 于 是幻觉 发表
Shader实例:序列帧动画的更多相关文章
- Unity Shader播放序列帧动画
Shader "LordShader/AnimateSprite" { Properties { _MainTint (,,,) //颜色属性,可以在u3d inspector面板 ...
- Unity Shader序列帧动画学习笔记
Unity Shader序列帧动画学习笔记 关于无限播放序列帧动画的一点问题 在学shader的序列帧动画时,书上写了这样一段代码: fixed4 frag(v2f i){ // 获得整数时间 flo ...
- unity shader序列帧动画代码,顺便吐槽一下unity shader系统
一.看到UNITY论坛里有些人求unity shader序列帧动画,写shader我擅长啊,就顺势写了个CG的shader.代码很简单,就是变换UV采样序列帧贴图,美术配置行数列数以及变换速度. Sh ...
- Unity Shader 序列帧动画
shader中的序列帧动画属于纹理动画中的一种,主要原理是将给定的纹理进行等分,再根据时间的变化循环播放等分中的一部分. Unity Shader 内置时间变量 名称 类型 描述 _Time floa ...
- cocos2d-x 2.0 序列帧动画 深入分析
转自:http://blog.csdn.net/honghaier/article/details/8222401 序列帧动画主要有几个类: CCSpriteFrame:精灵帧信息,序列帧动画是依靠多 ...
- [Cocos2d-x v3.x]序列帧动画
简单介绍 Cocos2d-x中.动画的详细内容是依靠精灵显示出来的,为了显示动态图片,我们须要不停切换精灵显示的内容.通过把静态的精灵变为动画播放器从而实现动画效果. 动画由帧组成,每一帧都是一个 ...
- iOS开发基础-序列帧动画之Tom猫
新建一个Single View Application,向该工程中导入Tom猫的图片资源,本示例演示Tom猫喝牛奶的动作.图片的名字为 drink_00.jpg.drink_01.jpg.....dr ...
- UnityShader 序列帧动画效果
实现原理:主要思想是设置显示uv纹理的大小,并逐帧修改图片的uv坐标. 实现步骤 1.我们首先用_Time.y和速度属性_Speed相乘得到模拟的时间. 2.然后我们用time除以_Horizonta ...
- Unity Shader 之 uv动画
Unity 动画 Unity Shader 内置时间变量 引入时间变量 名称 类型 描述 _Time float4 t是自该场景加载开始所经过的时间,4个分量分别是(t/20, t, 2t, 3t) ...
随机推荐
- android onCreate中获取view宽高为0的解决方法
view.post(runnable) 通过post可以将一个runnable投递到消息队列的尾部,然后等待UI线程Looper调用此runnable的时候,view也已经初始化好了. view.po ...
- sss
function handleTouchEvent(event) { if (event.touches.length == 1) { var output = document. ...
- 天河微信小程序入门《三》:打通任督二脉,前后台互通
原文链接:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=505&extra=page%3D1 天河君在申请到https ...
- 【openStack】Libcloud 如何支持 keystone V3?
Examples This section includes some examples which show how to use the newly available functionality ...
- Mysql 存储引擎中InnoDB与Myisam的主要区别
一直以为我spring事物没有配置好,结果发现是mysql的表本身设置成了Myisam 引擎.改成innodb就支持事物了. 1, 事务处理 innodb 支持事务功能,myisam 不支持. Myi ...
- 第3章 拍摄UFO——单一职责原则
就一个类而言,应该仅有一个引起它变化的原因
- dreamweaver cs6 mac破解版
http://www.sdifenzhou.com/dreamweaver-cs6-mac.html
- struts2 No result defined for action XXX and result input
这种错误的原因一般是页面的属性和action里的属性个数.名称.类型不一致造成的 困扰了我一下午的问题,原来是表单中有两个input-text的name属性重复了,然后接受参数的时候就出现了这个错误 ...
- cnentos中进行bond网卡配置,一切配置无问题,就是ping不通宿主机
服务器网口绑定 1. ifcfg-bond0 DEVICE=bond0 ONBOOT=yes IPADDR=192.168.100.64 NETMASK=255.255.255.0 2. ...
- freemarker 中文乱码
<bean id="freemarkerConfig" class="org.springframework.web.servlet.view.freemarker ...