Grid-Based Movement

  • 44 favourites

Attached Files

The following files have been attached to this tutorial:



Download now 193.39 KB


5,556 visits, 8,679 views



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.

In this tutorial, I'll explain a simple way to move characters smoothly from one grid location to another.

The moving character will require two behaviors: Bullet and Timer. Set the initial Bullet speed to 0 in the properties window.

The main idea is to use the formula: speed = distance/time.

If you want to move a character D pixels over a total of T seconds, you need to set the Bullet speed to D/T. (I stored the time required to move one grid square as an instance variable.) Stop moving (set the speed to 0) after the time interval has finished (the Timer handles this). Also, you should not accept another input while the character is moving. And finally, at the end of each movement you need to round the character's position to the nearest grid square location.

If your character also needs to navigate around walls, I recommend doing preventative collision detection: add another condition to each event and check if there is a wall in the position you will be moving to by using the "overlapping at offset"; if there is, don't allow the movement. Also, make sure that your character is a few pixels smaller than the grid size (for instance, a 30-by-30 character on a 32-by-32 grid), otherwise, the character might along the edge of an adjacent square, producing unexpected (and undesired) results.

A screenshot of the Event Sheet is below, and you can download a Capx file that implements this idea.

Hope this helps!



Download now 193.39 KB

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