It’s night when I’m writing this. I came up with a little Monkey X tutorial on how to program the bouncing of the ball, when it touches the bat in the “old school way” — like in the popular C64 game Krakout in the 80s.
In the video for the tutorial you can see, that as the ball touches the bat for the first time, delta y doesn’t change. This is because both the ball and the bat are uneven as height in pixels; now both the ball and the bat have a middle point.
This is just a short piece of code, that doesn’t handle the case, when the ball is at the horizontal top or bottom of the bat. There’s some extra work for anyone who wants to make an 80s style Krakout game. 🙂
The delta y for the ball is calculated simply how the ball’s y-position is related to the middle point to the bat. The “scale” variable is used to adjust the max y-speed of the ball.
Source code below:
Import mojo Function Main() New MyApp End Class MyApp Extends App Field gfxBG:Image, gfxBat:Image, gfxBall:Image Field scaleX:Float, scaleY:Float Field touchX:Float, touchY:Float Field prevTX:Float, prevTY:Float Field batY:Float Field ballX:Float, ballY:Float Field ballDX:Float, ballDY:Float Field scale:Float Method OnCreate() ' Load graphics gfxBG = LoadImage("bg2.png") gfxBat = LoadImage("bat3.png") gfxBall = LoadImage("ball4.png") SetDeviceWindow(640,480,0) scaleX = DeviceWidth() / 640.0 scaleY = DeviceHeight() / 480.0 ballX = 42 batY = 230 ballY = 230 + 36 - 8 ballDX = 2 ballDY = 0 prevTY = 0 touchY = 0 touchX = 0 touchY = 0 scale = 16 End Method OnUpdate() ' The if-sentence prevents the bat to appear at bottom of the screen at the start.. If prevTY <> 0 Then batY = batY - (prevTY - touchY) prevTY = touchY touchY = TouchY() touchY = touchY / scaleY ' Keep the bat in the borders of the screen If batY < 0 Then batY = 0 If batY > 479 - 72 Then batY = 479 - 72 ' Move the ball ballX = ballX + ballDX ballY = ballY + ballDY ' Keep the ball in the borders of the screen If ballY < Abs(ballDY) Then ballDY = -ballDY If ballY > 479 - 17 Then ballDY = -ballDY If ballX < -Abs(ballDX) Then ballDX = -ballDX If ballX > 639 - Abs(ballDX) - 16 Then ballDX = -ballDX ' Calculate the deltaY value for the ball in the "old school way"... If ballX >= 601 - 16 And ballY + 16 > batY And ballY < batY + 72 Then ballDY = -((batY + 36) - (ballY + 8)) / scale ballDX = -ballDX Endif End Method OnRender() PushMatrix() Scale(scaleX,scaleY) DrawImage gfxBG,0,0 DrawImage gfxBall, ballX, ballY DrawImage gfxBat, 601, batY PopMatrix() End End Class
Feel free to use and improve the source above in your own projects.
Here’s the graphics to download (license: public domain), except the background picture (right click and save as…):
The bat is 32 x 73 pixels as size, the ball is 16 x 17 pixels.
For comparing to the C64’s popular Krakout, see the video below:
Link: Monkey X (from itch.io), it’s free.
Many years ago I started to program Krakout style game in the spirit of the good old Commodore 64, but as usual, something went wrong. Three months work with multiple levels and a level editor programmed in Blitz3D were lost because I hadn’t taken backups of the files, when I, well, “fixed” the Windows installation I had at the time…