[Kotlin写游戏教程九]使用SpriteAnimations-外星人动起来了!

[Kotlin写游戏教程九]使用SpriteAnimations-外星人动起来了!

作者:丫丫    浏览次数:285    2021-06-15 15:47:11

已经连两篇都介绍跟动画特效有关的文章了,但是还不够唷,这一回正要介绍游戏制作也很常用的Sprite Animations。

Sprite Animations
SpriteAnimation物件就是由一连串连续的图片组合而成的,游戏中的角色或是物品会有连续动作想要呈现时,我们就能先画好这些图片影格,一张一张照顺序排好,接着让SpriteAnimaiton帮我们播放出来。而这些一张一张的影格我们会称作Sprite Sheet,如果你手边有这些动画影格,就可以将它合并成一组png档案,提供给KorGE来读档使用。

准备图片
上网搜寻应该都有很多图源,不过想要商用或是公开出来的还是要注意是否需要授权或是付费唷,这边笔者找到一个免费的资源,通常我们还是要在作品里特别感谢他们提供这些宝贵的资源。选这套的原因是单存是因为里头的外星人角色动作很可爱,也有一些地板上的素材跟障碍物素材,很适合拿来做跑酷类型游戏。

下载完档案后,解压缩图档资料夹可以找到绿色外星人每一张走路的图片

转换成Sprite Sheet
我们要先把它先转换成一张Sprite Sheet为green_alien_walk.png,这时可以利用TexturePacker这个工具帮助你转换。

安装好后,将那11张图片拖曳到中间区域

然后右边可以看到Packing区块,Alogrithm选Grid/Strip(因为这样读取每张图片时才不会大小不一样), Max size选1024。

接着再点选上方的Publish sprite sheet按钮。

命名green_alien_walk.png放到专案资料夹的/src/commonMain/kotlin/resources里头

开始写程式
因为外星人走路我们预计会是在GamePlay画面游戏开始时才会出现,所以我们就先打开先前有建立好的GamePlay.kt档案,把读取SpriteSheet跟播放SpriteAnimation的程式写到Container. ScenceMain()里头。

val spriteMap = resourcesVfs[“green_alien_walk.png”].readBitmap()
val alienWalkAnimation = SpriteAnimation(
spriteMap = spriteMap,
spriteWidth = 72,
spriteHeight = 97,
marginTop = 0,
marginLeft = 0,
columns = 11,
rows = 1,
offsetBetweenColumns = 0,
offsetBetweenRows = 0
)
val alien = sprite(alienWalkAnimation)
alien.spriteDisplayTime = 0.1.seconds
alien.playAnimationLooped()
读取档案的方式大家应该都不陌生了,主要是SpriteAnimation要设定的内容有spriteMap,也就是我们做好的外星人Sprite Sheet档案,然后我们要给播放图片的宽度spriteWidth=72跟高度spriteHeight= 97(请看每张的外星人图片档案都是这个大小),然后有栏位columns=11,列是rows=1。

SpriteAnimation(
spriteMap = spriteMap,
spriteWidth = 72,
spriteHeight = 97,
marginTop = 0,
marginLeft = 0,
columns = 11,
rows = 1,
offsetBetweenColumns = 0,
offsetBetweenRows = 0
)
最后将这SpriteAnimation传给sprite物件,然后播放的频率设为0.1秒,并设成无限制播放。

val alien = sprite(alienWalkAnimation)
alien.spriteDisplayTime = 0.1.seconds
alien.playAnimationLooped()
执行程式后就能看到绿色外星人在原地走动了!

想要让他移动就加上上回学过的tween啰!

while (true) {
alien.tween(alien::x[0.0, 512.0], time = 3000.milliseconds)
delay(1.seconds)
}
果然外星人开始移动啰!!

总结
学到这边应该有觉得越来越好玩了,因为有角色开始活了起来,能开始走动了!之后SpriteAnimation会应用到很多需要动起来的游戏物件上,所以除了绿色外星人之外,其他的外星人也能当作练习的材料,你也开始动手做吧!

上一篇:[Kotlin写游戏教程八]继续学习动画特效
下一篇:[Kotlin写游戏教程十]使用Input输入系统