DEV Community

Kartik Patel
Kartik Patel

Posted on

Top-down Controller in Mini Micro

Ever wanted to make a smooth top-down controller in Mini Micro for your next 2D game? Here is how:

What is a top-down controller?

A top-down controller is a system that lets your player move around freely in a top-down view game (where the camera looks at the player from above).

Think of

  • Pokémon (Game Boy era)
  • Stardew Valley
  • Zelda: Link to the Past

How Does It Work?

At its core, it:

  • Listens for Keyboard Input
  • Increments the position of the sprite multiplied by the direction and its speed

Here is a pseudo-code:

if W.pressed then x++ * speed if A.pressed then y-- * speed if S.pressed then x--* speed if D.pressed then y++* speed 
Enter fullscreen mode Exit fullscreen mode

What is Mini-Micro?

MiniMicro is a lightweight, virtual computer and programming environment designed for learning and creating with code.
It provides a retro-inspired interface where users can write and run programs in MiniScript(a simple, easy-to-learn scripting language), make games, draw graphics, and play with sound.

Implementation

Code

clear sp = new Sprite sp.x = 960/2 sp.y = 640/2 sp.scale = 2 sp.image = file.loadImage("/sys/pics/Ghost.png") display(4).sprites.push sp speed = 0.1 while true if key.axis("Horizontal") or key.axis("Vertical") then sp.x += key.axis("Horizontal") * speed sp.y += key.axis("Vertical") * speed text.row = 24; print "RUN " else text.row = 24; print "IDLE" end if end while 
Enter fullscreen mode Exit fullscreen mode

Explanation of Methods/Functions/Operators Used

This method returns true for an input axis x here in our code, x is Horizontal and Vertical, which can be signalled by WASD keys, Arrow keys, as well as any joystick or gamepad.'

  • +=

x += 1 is a short way of writing x = x + 1 in our code. we used it to increment the sprites x and y position.

Code Breakdown.

  • Creates a new Sprite named sp
  • Sets sp position on x axis to 960/2
  • Sets sp position on x axis to 640/2
  • Sets sp scale to 2
  • Sets sp image to the image on path ("/sys/pics/Ghost.png")
  • Displays sp sprite on display(4)[The by Default Display for sprite rendering]
  • Creates a speed variable by setting it to 0.1
  • Creates a while true while loop (Never Ending Loop)
  • Makes an if statement which checks whether key.axis Horizontal and Vertical return true or not
  • If the parent if statement is true, then it updates the sprite's x position
  • If the parent if statement is true, then it updates the sprite's y position
  • Prints RUN on 24th text row
  • Creates an else block
  • Prints IDLE on 24th text row
  • Ends if block
  • End while block

Outro

I know this is a very short blog then my usual blogs, and the reason for this is, I am starting to try to blog daily. So, giving the same quality I used to give in weekly blogs is hard.

Till then, stay awesome and watch this

Top comments (0)