使用Spine制作骨骼动画

原文地址:Using Skeletal Animation With Spine
原作者:Mark Alexander

本文将向您介绍一个非常强大的工具,该工具可以使用骨骼动画创建更自然的精灵。 其背后的原理是,您创建一个基础骨骼 ,然后移动骨骼以创建姿势。 然后可以将这些姿势转换为动画关键帧,然后对每个关键帧之间的骨骼位置进行插值计算以创建平滑且非常自然的动画。然后可以对该动画进行蒙皮 并像精灵一样绘制到屏幕上。

GameMaker Studio 2支持这种类型的动画精灵,因为它可以导入Spine创建的文件使用,该程序是创建骨骼动画的绝佳工具(您可以在此处找到更多有关Spine的信息)。 请注意,Spine是一个非常强大的程序,具有很多可能性,这样一篇简单的文章几乎不可能完全解释其工作原理! 但是,我们将简要描述其与GameMaker Studio 2 协作实现骨骼动画精灵的方式的一些关键步骤。

注意Spine的试用版可从此处下载: http://esotericsoftware.com/spine-download


Spine概述

如简介所述,Spine的工作原理是先创建骨架,然后摆姿势以创建动画。 骨骼由骨头组成,每块骨头可以在设定的时间范围内相对于彼此进行附着和位移,然后用角色动画图形蒙皮输出最终动画。 然后可以将该动画导出为位图精灵带(Bitmap Sprite Strip),或导出为Spine JSON文件,以导入到GameMaker Studio 2 的精灵编辑器中并添加到游戏中。

The Spine Interface
如果您只是导出位图精灵,那么您读到这儿就可以打住了,因为创建和使用“普通”精灵的方法众所周知。但无须赘言,如果您使用Spine导出 JSON格式的动画,与简单的精灵图相比,它可以实现更多的功能。

骨骼动画的一些最基本的功能有:

  • 只需要用一个精灵就可以对其创建多个动画-例如行走,跑步和跳跃的动画集
  • 可以给精灵设置多个皮肤,以便对单个骨骼进行不同外观的蒙皮,这样用单个精灵就可以创建多个角色(当然,所有角色都具有相同的动作)
  • 您可以给精灵 附着附件,给他们添加其他物品的来进一步改变它们的外观 (类似纸娃娃)

导入JSON 格式的精灵后,所有以上这些内容(甚至更多功能!)也可以在GameMaker Studio 2中使用。

注意您可以在这里找到所有Spine功能的完整文档: Spine文档
注意GameMaker Studio 2需要特定的Spine runtime版本才能正确导入和使用其创建的骨骼动画精灵。 请参阅GameMaker Studio 2所需SDK一文,以了解当前所需的 runtime。


基础

在导入GameMaker Studio 2之前,使用Spine时,有必要先了解一些关键概念。 首先,您需要给骨骼和其他一些东西命名,这些名称将成为您在GMS2中使用动画时用作动画的“句柄”的名称。 我们建议您设定易于记忆,简短和一致的名称。

您还需要注意动画中根节点位置。 根节点是将Spine动画锚定在Spine空间中的位置,当您将精灵导入GameMaker Studio 2时,这将被转换为精灵资源的x / y原点 ,并且该种情况下的原点在GMS2精灵编辑器中是不可编辑的。 您对骨骼运动的大多数计算也将取决于此根节点的位置。

Spine精灵的根
创建动画时,请设置一个姿势,然后从该姿势创建关键帧。 之后,您可以改变动画的时间轴并创建另一个关键帧。 完成此操作后,Spine将在关键帧之间插入骨骼数据以提供平滑的动画,然后可以对其进行命名和保存。 您可以为一个精灵创建多个动画集,并为每个精灵指定一个单独的名称,然后可以在GameMaker Studio 2中使用该名称为导入的精灵设置骨架动画姿势。

Spine精灵还有一些附件插槽 ,这些插槽可以让您的精灵绘制骨骼的子图像。 然后使其与父骨骼一起移动,这样您可以为动画提供多个子图像,附着到单个精灵上。 这些附件插槽以及它们使用的图像都应正确命名,当你GameMaker Studio 2中使用并要切换附着物时就需要用到这些名称。

准备好 Spine 精灵后,可以将其导出以用于GameMaker Studio 2。导出精灵时,请确保从导出选项中选中Texture Atlas:Pack选项,因为GameMaker需要生成的 -atlas 文件,而此处如果未选中则不会创建该文件。

导出Spine精灵


导入 Spine 精灵

当您将Spine的骨骼动画精灵导出为JSON时,实际上您将创建三个独立文件:包含所有骨骼数据和动画的基本.json文件,包含有关如何包装纹理数据的.atlas文件,以及一个.png文件,其中包含纹理本身。 这里要注意的重点是,这些文件必须全部放置于同一文件夹中,才能确保精灵能正确导入GMS2。

将Spine精灵导入GMS2
将它们导入GameMaker Studio 2的方法几乎与添加普通位图图像的方法相同-您需要创建一个新的精灵,然后单击“导入(import)”按钮,这将弹出一个系统的文件选择器对话框,然后浏览你保存Spine文件的位置并选择要导入的文件,请确保底部的文件过滤选项中选择了* .json 。

导入动画后,可以设置碰撞属性,但是请注意,此处仅限于使用精确的碰撞或边界框碰撞,并且骨骼动画的碰撞数据完全是从文件提供的数据中获取的。 如果导入的文件中缺少相关数据,GameMaker Studio 2不会生成任何碰撞遮罩,这意味着如果在Spine中未正确设置遮罩,您将无法得到有效的碰撞判定。 还要注意,与位图精灵不同,导入的骨骼动画精灵不能以任何方式在图像编辑器中进行修改 ,这意味着需要进行的任何更改都应在Spine中进行,然后重新导入到您的游戏中。

注意由于骨骼动画的复杂性,精灵编辑器中显示的预览图像并不能准确表示您的动画,而只是为您提供了一个简单的图像来表示动画,以便在房间编辑器中有个图像标识。


在GameMaker中使用Spine精灵

将精灵加载到GameMaker Studio 2中后,就可以像使用其他任何精灵一样使用它。 您可以将它们分配给对象,或将它们赋值给代码创建的实例,它们也能响应实例中大部分精灵变量——可以缩放,旋转,着色和更改alpha值——所有这些都可以在游戏中操作。可以像使用其他任何精灵一样使用大部分sprite_*()函数来绘制它们,但draw_sprite_pos()draw_sprite_part() 不适用。

Spine Sprites In GM Using Regular Sprite Functions
但是,使用Spine的目的是创建具有多个姿势和外观的骨骼动画精灵,这跟普通的位图精灵差别就很大了。 因此,GameMaker Studio 2具有一套专门的 skeleton_*()函数,以及用于处理这类精灵的动画更新事件(Animation Update Event) 。 本文的其余部分将简要概述最常用的功能及其功能,但是您可以在帮助手册中找到每个功能的完整说明。


动画

skeleton_animation_get(); 
skeleton_animation_set(name);

这些函数将获取当前设置的 Spine 精灵动画的名称(字符串),或将精灵设置为指定名称的动画。 因此,假设您各有一个“奔跑”和“行走”动画,那么可以使玩家按下某个键时,用这些函数在两个动画之间进行切换。

skeleton_animation_get_ext(track); 
skeleton_animation_set_ext(name, track);

这些功能与上面的动画功能相似,但工作方式稍微复杂一些。 Spine允许您仅为骨骼的一部分定义骨骼动画,然后可以为这些部分创建单独的动画集并使它们一起播放。 每个动画都单独分配一个轨(track),其中 track0 始终是默认动画。 这样您可以为人物分配一个“行走”动画,并且该动画仅影响腿部。 然后您还可以设置其他各种动画,包括仅移动手臂,头部或上身等,并使用这些函数将其中一个动画分配给 track1。 然后,GameMaker Studio 2 可以同时播放两个动画。

skeleton_animation_mix(animfrom, animto, duration);

对于导入的精灵的最终样式,这个函数可能是最重要的功能之一。 您可以使用上面提到的skeleton_animation_set()函数随时更换动画,但是这样操作会把图像索引(image index)重置为0,这可能会导致从一个姿势切换到另一个姿势时不够自然出现“跳帧”。使用位图精灵,这是可预料的,甚至可能你更希望这么实现。但是对于骨骼动画精灵,它看起来很奇怪甚至会有 bug。 但您可以使用skeleton_animation_mix()函数改善这个问题,该函数将对给定的动画集进行插值计算,使不同动画进行更自然的过渡。 例如,您可以先把“跑动”动画混合进“跳跃”动画,然后反过来把“跳跃”动画混合到“跑动”动画,这样精灵就可以在两组动画之间无缝切换。


蒙皮

skeleton_skin_get(); 
skeleton_skin_set(skinname); 

单个骨骼精灵动画可以具有一或多种蒙皮 ,可以使用上面的函数对其进行切换。 这意味着您可以在游戏中拥有多个角色,并且梅格角色都可以具有不同的样子,但使用相同的基础骨骼动画精灵。 GameMaker Studio 2允许您以这种方式为每个单独的骨骼动画精灵设置不同外观,甚至可以为每个精灵使用多种纹理(参考文章Spine:使用多纹理页对此进行了详细介绍)。 请注意,在设置 Spine 精灵时,应牢记导出系统平台,并在将精灵导出到适合对应平台尺寸时设置纹理页面尺寸。 例如,如果面向移动设备,则可能需要将Spine纹理页面设置为1024x1024,但对于桌面平台,则可以使用 2048x2048 甚至更大。

The Spine Texture Packer


附着

skeleton_attachment_get(); 
skeleton_attachment_set(slotname, imagename); 
skeleton_attachment_create(imagename, sprite, ind, xo, yo, xs, ys, rot);` 

如前所述,您可以将图像附着到骨骼动画精灵上,它们会像动画骨骼结构的一部分一样跟随动画运动。以上函数就是用来设置附着物的,您只需选择插槽(slot)名称(在Spine中定义)来附着所选择的附件即可。您可以使用游戏中任何一种精灵资源——可以是基础的精灵或游戏内含物资源(include files)——这在游戏中可以更为灵活。


绘制

skeleton_collision_draw_set(flag); 
draw_skeleton_collision(sprite, animname, image_index, x, y, xscale, yscale, rot, colour); 
draw_skeleton(sprite, animname, skinname, image_index, x, y, xscale, yscale, rot, colour, alpha);

通常您会使用draw_sprite_*()函数绘制骨骼动画精灵,但有时您需要绘制额外的数据或单个动画的单个子图像(例如暂停屏幕或特殊效果等情况时)。 这就是为什么要添加这些函数的原因,其中第一个函数只是标记碰撞数据以供绘制。 如果设置为true,那么您将在屏幕上看到精灵的边框及绘制的碰撞蒙版(此数据是在Spine中创建精灵时创建的),而第二个功能允许您绘制任何动画的单个帧碰撞蒙版。

使用Spine的精灵碰撞蒙版
最后一个函数有些不同,它允许您绘制任意蒙皮的任意动画的任意帧,这使其成为测试游戏时的强大工具。请注意,尽管您可以在游戏中使用它来绘制 Spine 精灵动画的某一帧,但由于GameMaker Studio 2必须进行多次计算才能正确定位指定帧的骨骼位置,因此它性能开销巨大,因此实际运用时应尽量避免。


结语

正如上文所述,你可以想象得到骨骼动画是一个非常强大的工具。它允许你用最少的工作量实现尽可能自然的动画效果,并且(在混合功能之下)这些动画可以无缝融合切换,从而在游戏中创造出非常流畅的玩家体验。GameMaker Studio 2中提供的蒙皮和附着功能还意味着您可以简化从单一来源生成多个精灵的过程,甚至允许玩家在运行时自定义它们。 显然,这并非一个适用于所有游戏的机制,但是如果您查看了 Spine 网站和下面链接中的 DEMO,您会发现它具有令人惊讶的可拓展性,值得花些时间和精力去尝试制作一个精灵,并将其导入GameMaker Studio 2。

Spine 骨骼精灵基本功能演示

上面的 DEMO 是用Spine 创建的,并演示了本文中提到的一些功能。

2020-01-19 21:47
Comments
Write a Comment