温馨提示！由于新浪微博认证机制调整，您的新浪微博帐号绑定已过期，请重新绑定！&&|&&
我是阿赵,请多多指教！
LOFTER精选
网易考拉推荐
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
spine骨骼动画&在它的官网里面，可以看到它支持这么多的引擎和平台：然后在官网也有对应的运行库下载，我最熟悉的unity和as3 它都支持：&编辑器自带了几个例子，打开其中一个是这样的，这是setup界面，可以设置图片的位置和摆放骨骼：&这是动画制作界面，可以在时间轴上面打关键帧做动画，除了直接移动骨骼做动画以外，还可以给骨骼上的图片换图，比如这只龙的翅膀，在扇动的时候其实是用了序列图做扇动的效果的。&还有其他一些例子，可以同一个文件里面包含多个动画&再来看看导入到Unity3D的情况了：可以看到刚才spine里面的龙已经进入了Unity了，播放动画后它将会和在编辑器里面一样的运动起来。&看了一下它的原理，spine给unity写了几个扩展的组件，包括了骨骼、网格和动画，只需要拾取了数据，那么这个物体将会是一个整体，使用动态网格的形式生成。（当然了，这种程度的功能我自己也能写出来，不过比较麻烦）。放置多几个动画测试一下，感觉性能还算过得去吧。可能是由于最新版的spine推出的时间比unity4.3要早，所以它暂时没有对应Unity2D sprite的运行库，只有对应了2D toolKit的运行库。不知道以后它会不会再针对Unity2D来做一个更新呢？ 最后补充说一句，Spine的试用版是免费的，普通版是大概300多元吧，专业版是差不多1600元。&&
阅读(20027)|
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
历史上的今天
在LOFTER的更多文章
loftPermalink:'',
id:'fks_',
blogTitle:'推荐一个2D骨骼动画编辑工具，可以用在Unity3D和As3',
blogAbstract:'\t如果你喜欢做2D横版游戏，使用2D骨骼动画是一个不错的选择，因为2D骨骼动画可以用最小的资源量做出复杂的动画。最近在使用Dragonbones骨骼动画的时候，接触到了这么一个2D骨骼动画编辑器，感觉还不错，于是打算推荐给大家：spine骨骼动画&在它的官网里面，可以看到它支持这么多的引擎和平台：',
blogTag:'spine,2d,骨骼动画',
blogUrl:'blog/static/',
isPublished:1,
istop:false,
modifyTime:0,
publishTime:1,
permalink:'blog/static/',
commentCount:8,
mainCommentCount:2,
recommendCount:0,
bsrk:-100,
publisherId:0,
recomBlogHome:false,
currentRecomBlog:false,
attachmentsFileIds:[],
groupInfo:{},
friendstatus:'none',
followstatus:'unFollow',
pubSucc:'',
visitorProvince:'',
visitorCity:'',
visitorNewUser:false,
postAddInfo:{},
mset:'000',
remindgoodnightblog:false,
isBlackVisitor:false,
isShowYodaoAd:false,
hostIntro:'我是阿赵,请多多指教！',
hmcon:'0',
selfRecomBlogCount:'0',
lofter_single:''
{list a as x}
{if x.moveFrom=='wap'}
{elseif x.moveFrom=='iphone'}
{elseif x.moveFrom=='android'}
{elseif x.moveFrom=='mobile'}
${a.selfIntro|escape}{if great260}${suplement}{/if}
{list a as x}
推荐过这篇日志的人：
{list a as x}
{if !!b&&b.length>0}
他们还推荐了：
{list b as y}
转载记录：
{list d as x}
{list a as x}
{list a as x}
{list a as x}
{list a as x}
{if x_index>4}{break}{/if}
${fn2(x.publishTime,'yyyy-MM-dd HH:mm:ss')}
{list a as x}
{if !!(blogDetail.preBlogPermalink)}
{if !!(blogDetail.nextBlogPermalink)}
{list a as x}
{if defined('newslist')&&newslist.length>0}
{list newslist as x}
{if x_index>7}{break}{/if}
{list a as x}
{var first_option =}
{list x.voteDetailList as voteToOption}
{if voteToOption==1}
{if first_option==false},{/if}&&“${b[voteToOption_index]}”&&
{if (x.role!="-1") },“我是${c[x.role]}”&&{/if}
&&&&&&&&${fn1(x.voteTime)}
{if x.userName==''}{/if}
网易公司版权所有&&
{list x.l as y}
{if defined('wl')}
{list wl as x}{/list}用unity5.3.1制作sprite动画，图片是sprite格式，将每个图片拖动至Animation中，点击Animation中的运行按钮，Game试图中没有任何变化。并且在保存Animation Clip时，也没有出现Animation Controller，请问如何做sprite动画。
您需要登录后才能查看回答!
1号核心群：
info@youke.pro> 博客详情
经过昨天2dtoolkit系列教程一的推出，感觉对新手还有有一定的启发作用，引导学习使用unity 2dToolKit插件的使用过程，今天继续系列二——动画精灵的创建，以及背景图的无限循环滚动，在群里总是看到什么技术好，什么技术不好，新手永远迷惑是学C#呢还是学java呢，是cocos2d呢还是unity呢，总想着什么比较火，其实没必要这样，让自己选择两难，每个人都有选择困难症，也不要想一口吃掉一个大饼，想贪图取巧，说不定别人跟你说什么什么技术比较火，但也就是目前，等到你一个新手学成的时候，说不定又被新技术给取代了，只要是IT技术，认准一点学，好好啃精，其实技术都是相同的，重要的学到思想学到解决问题的方法，这个是最重要的！接下来废话少说，继续今天的内容。
一、看一下整体的效果图
由于CSDN不好上传Flash，这也是头疼的一个地方，不像其他博客一样，可以上传flash，展示动态效果，这就上传到百度图库，(点击查看)，我也截图部分帧图片，看细节会发现一些变化，背景移动了，小龙翅膀晃动了！
看小龙的翅膀和下面小虫的位置移动，这说明背景在动，龙也在动！哇咔咔！
二、详细制作过程
1.准备一系列的序列帧图片
序列帧图片是我们制作动画的一个必备素材，根据我们了解了创建精灵集的方法，同样，我们在制作序列帧动画之前还是要先做一个精灵集，将这些序列帧图片放入精灵集中。
2.制作序列帧动画
1.在Assets目录下创建一个Animation的文件夹-&右击Create-&tk2d-&Sprite Animation
2.点击刚刚的DragonAnimation-&点击OpenEditor...编辑他的属性
然后添加动画帧图片，制作动画
当创建完所有的动画帧之后，可以点击一下Play看看效果，感觉不错，呵呵！
3.创建动画精灵
在Hierarchy面板中-&Create tk2d-&Sprite With Animation
命名为AnimatedDragonSprite，找到tk2dSpriteAnimator组件，修改AnimLib，选择刚刚创建的动画
然后我们运行一下，会发现Game面板中就会出现一个不断抖动翅膀的小龙，真的好萌，哇咔咔！截图我就不截了，跟上面效果图一样。
三、背景的无限循环滚动
在2d游戏制作中，你会发现一个规律，一般就是主角精灵都是固定在屏幕的某个位置，但还会让你感觉它在动，因为这是视觉视差，其实动的是背景然你感觉是主角精灵在动，2d游戏制作巧妙的应用了这一点，这就是物理学上的相对运动。
原理就是一张相同的图片，我们拷贝一份，将两个粘连在一起摆放，其中的一个图片正好作为整个屏幕的背景，另外一个正好处于刚要进入的区域，然后当第一张刚好要离开屏幕的时候，然后更改到右边第二张，这样循环往返就能实现效果。
直接贴代码：
&&&public&float&&&
&&&private&float&&&
&&&public&float&minPositionX;&&
&&&public&float&terPositionX;&&
//&Use&this&for&initialization&&
void&Start&()&{&&
//&Update&is&called&once&per&frame&&
void&Update&()&{&&
&&&&&&&movespeed&=&speed&*&Time.deltaT&&
&&&&&&&transform.Translate(Vector3.left&*&movespeed,&Space.World);&//向左移动&&
&&&&&&&if&(transform.localPosition.x&&&minPositionX)&&
&&&&&&&{&&
&&&&&&&&&&&transform.localPosition&=&new&Vector3(terPositionX,&transform.localPosition.y,transform.localPosition.z);&&
&&&&&&&}&&
很简单的Code，呵呵，然后将这脚本拖放到背景图中，运行一下就看到背景无限滚动了！
沉浸在写博客中，不知不觉又到了凌晨两点，我很享受这样的过程，与人分享，让学习不再困难，貌似我适合写书的岗位，哇咔咔，希望有哪天能出版自己的书籍！这是一个梦，当然最近也有给我提供图书编辑的岗位，但还是享受现在这过程，充实每一天，呵呵！改洗洗睡了，明天继续，学习永不止步！
转载请注明出处：
在线演示：
==================== 迂者 丁小未 CSDN博客专栏=================
MyBlog：& & & & & & &MyQQ:
Unity QQ群：858550 & & & & cocos2dx QQ群：
======================&相互学习，共同进步&===================
人打赏支持
码字总数 24438
支付宝支付
微信扫码支付
打赏金额: ￥
已支付成功
打赏金额: ￥我们在玩任何一款手游产品时，都是先上来个logo界面，游戏欢迎界面等，这就意味着我们要做一款游戏需要多个场景，场景之间来回切换实现游戏逻辑，unity也不例外，所以从本篇开始将会介绍如何搭建多个场景，本篇先看游戏logo场景的制作，先上图：
再次用时空领地的logo了，这里的时空领地的logo是个动画，全部是用NGUI实现的，重点是做这个界面没用一句代码，除了点击切换场景。
之前那个游戏场景，我起名GameScene，然后我新建一个场景File-&New Scene，起名BeginMenuScene。下面开始制作。
1、先用NGUI新建一个Atlas，把场景中用到的图片都加到Atlas里，不知道怎么建Atlas的看前面的文章。
2、用NGUI建一个UI Root，然后在Panel下新建一个Panel和Texture，因为上图右上角的游戏logo是由背板，文字动画，箭头动画三个部分组成的，所以我把它们统一放到这个Panel里，背景图片放到Texture里，其实背景图片也可以是个Sprite，由你喜好。结构图如下：
3、把背景图片拖到Texture的UITexture里，这样背景就有了，别忘了把尺寸改成图片大小。
4、把logo的Panel移到合适位置，里面的那个背板不说了，就是个sprite，放到合适位置就可以了，重点说Sprite动画，先看一下atlas图片：
上图中包含一个logo背板，11帧文字动画，14帧箭头动画，以文字动画为例，NGUI怎么不用一句代码加载动画呢，我们要用到Sprite Animation，选Component-&NGUI-&UI-&Sprite Animation，这样我的Sprite(LogoText)就增加了UISprite Animation组件，是个脚本，你可以看看里面的代码。我的设置如下：
Framerate是帧速率，最大60，越大播放越快，Name Prefix是图片名的前缀，这个很有用，比如我的atlas里有很多不同种类的图片，像上面，有背板图片，文字图片，箭头图片，那我这里的动画只想用文字的11张图片，怎么办呢，Name Prefix起作用了，它能够对文件名过滤，比如我的文字的图片都是以menu_title_为前缀的，menu_title_01，menu_title_02，...，menu_title_11，这样它就只会用到这11张图片了，并且会根据后面的数字排序播放，有一点要注意，后面的数字如果像01，02等有0在前面，那超过9的话要把0取消，直接10，11等，而不能010，011，这样顺序会错。Loop表示是否循环播放。就这么简单就能实现简单的动画循环播放了，如果想程序控制，那就看源代码怎么用吧。箭头动画也是如此，我就不介绍了。
5、NGUI屏幕自适应
不要以为这样就完了，如果你的图片是960*640的，或是其他的分辨率，而你的屏幕不是，在手机各种屏幕尺寸的今天，做不同分辨率的图片是多么痛苦的一件事，就像上面，运行一下程序，总是有难看的黑边，除非我把屏幕也拉成960*640的，不要怕，NGUI早就为我们处理了，只要加个Stretch就好了，点选Anchor下的那个Panel，我要把Stretch给它，因为它是整个界面的Panel，选择Component-&NGUI-&UI-&Stretch，你就会发现你的Inspector面板上新增了一个UIStretch脚本，下面就是调参数，网上搜的NGUI屏幕自适应教程大部分都是转的，调一堆参数，也有人经过试验发现了个捷径，我这里只说捷径，Style那里选Both，表示长宽都拉伸，Relative Size那里X=1/960，Y=1/640，这样就可以了，960和640是图片的宽高，根据你的尺寸可改，截个图：
本篇重点介绍了NGUI的Animation Sprite制作sprite动画和如何屏幕自适应，但这里并没有交互，下一篇文章介绍如何异步加载游戏场景。
阅读(...) 评论()}