For our enemy sprite, we'll use a multi-frame sprite sheet setup for animation. Animating a sprite sheet requires reworking canvas' c.drawImage() quite a bit. Basically, instead of using three or five arguments, we use nine, and all of the arguments' positioning changes which can make the refactor quite confusing.
I'll walk you through it step-by-step, declaring descriptive variables in all the right places so you can walk through the animation process with ease.
0:00 Extend Enemy class from Sprite class
4:15 Crop enemy sprite sheet
10:43 Animate enemy sprites
15:31 Slow down animation with frame hold
Hi Chris,
First I'd like to say thank you so much for these tutorials, I'm learning so much.
I'm just a bit confused with my mouse and collision it seems to be off and clicking in the wrong place.
so I went back and copied and pasted your code but it still happens. I know your busy but please find time to take a quick look I need your help I'm so close to finishing.
Heres my github repo......
https://github.com/SPUR-TECH/base-defence
Thank you.