对于不同的朝向使用不同的动画(类似RPG Maker素材)

2

Tagged

Attached Files

The following files have been attached to this tutorial:

.capx

moveanimexample.capx

Download now 39.05 KB
.capx

moveanimexamplekeyboard.capx

Download now 39.04 KB

Stats

7,894 visits, 9,210 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 5 Apr, 2013. Last updated 25 Feb, 2019

有两种方法可以实现标题所说的效果(不使用Sprite对象的旋转,而使用不同的Animation区别角色的朝向)。方法1:玩家与非玩家均可以使用;方法2:只能用于玩家,但速度快,占用少。此教程使用的软件版本:Construct 2 Release 108.2,64位版本。

准备工作

首先你需要一些行走图素材,比如下面这张图片。你也可以直接使用RPG Maker中自带素材。下面就以这张图片为例(素材作者:Holder;来源: Holder's Animated Battlers)。

首先需要把这个素材导入到Construct 2中。双击画布空白部分,插入一个Sprite对象。

(如果你不知道怎么做,你应该去看看Construct 2新手教程

接着弹出一个空的图像编辑器。我们先看下方的小的长条框(Animation Frames (1)),在它上面右击,选择Import sprite strip...,打开你的素材。

然后输入图像中的行、列数,这里是3列4行。

于是我们就得到了一个有13帧的动画——12帧是刚导入的,还有一帧是原来就有的空白帧——得把它给删了。

这个动画一定是会循环播放的。难道你看到某人在路上走着走着就抬起一只脚滑行了吗——哦,溜冰除外。所以我们得在左侧的Properties里把Loop参数改成Yes

现在的动画里有12帧:3帧朝向下,3帧朝向左,3帧朝向右,还有3帧朝向上。但是它们全都待在一个动画里,于是这个人就一会上一会下。

所以,我们必须把它分割成4个动画——下,左,右,上。最简单的方法,就是使用Duplicate功能制作4个同样的动画,再删除每个动画中不该有的帧:

(你最好把这些动画的名称改成WalkUpWalkLeftWalkDownWalkRight。那样,就绝对不会混起来了——虽然用2、4、6和8也是不错的选择。)

最后,4个动画应该是这样的:

好了,行走的动画已经准备完毕,现在需要制作停止的动画——这个主角不该是一直踏步的。于是再一次使用Duplicate功能,并且把动画的名字改成StandUpStandLeftStandDown还有StandRight。接着删除这些动画中的其他帧,只留下中间的站立帧。

然后把Default动画也改成类似StandDown动画的样子。

动画设置暂时告一段落,是时候使用它们了。关掉图像编辑器,然后把这个Sprite对象重命名为PlayerAnimations

然后再添加一个Sprite,关掉弹出的图像编辑器——此时的Sprite变为空的图像,把它的名字改成Player

刚才的PlayerAnimations的大小是64×64像素,所以把Player的大小也改成64×64。

接着把Player的位置改成和PlayerAnimations一样的位置。比如这里是(456, 324),就把PlayerAnimations的X和Y属性改成456324。现在这两个Sprite重叠起来了。

它们的位置在运行时是不变的——当Player移动时,PlayerAnimations照样呆在原位。所以我们需要一个Pin行为来控制它们的位置(你也可以用其他的方法,比如直接控制X与Y参数,这也许更有挑战性——可以在这里找到这种方法的详细说明)。首先找到PlayerAnimationsBehavior栏,添加一个行为。

添加一个Pin行为。

切换到Event sheet中,添加一个事件。

双击第一个System对象。

然后选择列表底部的On start of layout事件。On start of layout意思是在某个Layout被载入时被执行,这里就是指Layout 1

然后添加一个动作:点击Add action链接。

双击PlayerAnimations

Pin to object

点击<click to choose>按钮,然后选择Player

为了让角色动起来,需要在Player对象上添加一个行为。

添加一个8 Direction行为。现在我们可以用键盘上的方向键让角色动起来了。

如果现在就运行这个游戏,你会觉得很怪异——行走图还是会跟着一起转,就跟没有做任何事几乎一样。

一起修正这个问题吧。首先在8 Directions的参数中,把Set angle设置为No,然后把Directions参数改成4 directions

方法一

角色总算正常点了。但是还有些小问题,比如虽然角色会动但却不会走路!

所以,回到事件页中,添加一些事件。

第一个事件Player8 DirectionIs moving

Construct 2不知道角色应该朝向哪里,所以你需要建立一个实例变量(Instance variable)。如果你不做这些,角色永远朝向同一面——天哪!

下面来创建这个变量。在Player对象上右击,选择Instance variables...

点左上角的加号,添加一个名为Direction的实例变量,并且把它的类型改为Text

切换到事件页,在之前创建的事件上右击,选择AddAdd sub-event (s)

第一个事件的子事件一SystemCompare two values

现在,如果角色在移动的话,这个子事件会不断执行——一秒,甚至一毫秒中会执行好多次——为了判断角色的朝向,然后保存到那个实例变量中。

8Direction行为的朝向是储存在Obj.8Direction.MovingAngle中的。所以这里的朝向表达式是Player.8Direction.MovingAngle。这就是First value参数。

方向是角度,单位是度。还记得之前我们把8Direction行为限制成了4方向吗?所以现在只有4种可能的角度:-90(↑)、180(←)、90(↓)、0(→)。

在这个子事件中,我们是检查角色是否朝向上。所以,Second value参数的值是-90

如果角色正在向上移动,那么那个实例变量的值应该是"Up"。所以这个事件的动作是PlayerSet value

然后输入"Up"(带有半角引号)作为参数值。

制作与之类似的其余3方向事件。

好了,实例变量准备完毕,只需要再调整角色的动画即可。

又一个子事件PlayerCompare instance variable

这个事件的Value"Up"。这个事件是检查角色是否向上。

如果是的话,就该播放WalkUp动画。所以动作是PlayerAnimationsSet animation

输入"WalkUp"作为Animation参数值。

制作与之类似的其他3方向事件。

测试游戏后发现,角色终于能正常行走了。但是停下后,他还在原地踏步!我们得解决这个问题。

第三个事件PlayerIs moving

右击这个条件,选择Invert。这个事件就变成了当角色不在行走的时候才执行。

继续添加子事件。

第三个事件的子事件一PlayerCompare instance variable

Value参数值是"Up"

动作是:PlayerAnimationsSet animation

参数是StandUp

继续制作其他方向的事件。

这就是为什么要新建一个实例变量的原因了。当角色停下时,Player.8Direction.MovingAngle永远是0。我们就不能用这个表达式控制角色停下时的朝向。要是Scirra把这个问题改好了,这个教程也许就能变得很短了:)

(最好是添加个用动画控制角色朝向的功能,那样这篇教程都不用写了XD)

现在的角色已经几乎完美了,我们试试让角色撞到其他东西。

在其他对象上添加一个Solid行为。

这个角色完全能自如的行走了!你可以试试看,往各个方向行走,在任何地方停下。

如果你创建了个HUD,看到角色的MovingAngle,你会发现当角色转向的时候这个角度会有奇怪的跳动。希望Scirra能修复这个BUG。

方法二

(请直接跳到这里的读者先看方法一)

第二种方法就是玩家专用的方法,就是用键盘的按键来判断朝向!这需要一个Keyboard对象。

接着把这些事件:

替换成这样:

这方法也许占用资源更少,也更方便,在游戏中几乎看不出与方法一的区别。推荐使用这个方法。

一点补充

有时候为了防止角色走出画面,需要使用Bound to layout行为。但是当角色走到边缘时,角色还在走——但角色却不动。这个问题很容易修复,比如当角色走到边缘时播放停止时的动画等。

范例文件(方法一、二均有):传送门

这个文件包含了一个HUD用于显示Player.8Direction.MovingAnglePlayer.Direction用于DEBUG。

如果有谁知道那个表达式的跳动问题的解决方案,欢迎在下面评论,让大家都知道吧!

.CAPX

moveanimexample.capx

Download now 39.05 KB
.CAPX

moveanimexamplekeyboard.capx

Download now 39.04 KB
  • 1 Comments

  • Order by
Want to leave a comment? Login or Register an account!