Bouncing ball paddle game

The same pattern follows with the right cursor and the rightPressed variable. We've now set up the variables for storing the info about the pressed keys, event listeners, and relevant functions. Next we'll get into the code to use all of the things we just set up and to move the paddle on the screen. Inside the draw function, we will check if the left or right cursor keys are pressed when each frame is rendered.

Our code might look like this:. If the left cursor is pressed, the paddle will move seven pixels to the left, and if the right cursor is pressed, the paddle will move seven pixels to the right.

This currently works, but the paddle disappears off the edge of the canvas if we hold either key for too long. We could improve that and move the paddle only within the boundaries of the canvas by changing the code like this:.

The paddleX position we're using will move between 0 on the left side of the canvas and canvas. Add the above code block into the draw function at the bottom, just above the closing curly brace. The only thing left to do now is call the drawPaddle function from within the draw function, to actually print it on the screen. Add the following line inside your draw function, just below the line that calls drawBall :.

Improve this answer. Eric Barr Eric Barr 4 4 silver badges 7 7 bronze badges. Once it hits the paddle it jumps up to the top of the frame so I think that would make sense if I'm changing the the Y value instead of deltaY. It does have the same behavior with the blocks as well — user Yup that looks like the problem then.

I'll add some code to my answer to make the changes more clear. The Overflow Blog. Podcast Helping communities build their own LTE networks. Podcast Making Agile work for data science. Featured on Meta. New post summary designs on greatest hits now, everywhere else eventually. Related 0. Build your own working steam engine! This kit includes all of the metal parts to make Jensen's large.. Solid Fuel Refills!

A set of 20 white bricks to fuel your Jensen Steam Engine. Each white brick is a.. Lilliput Robot : The original and classic tin robot - He walks and leans forward while swinging.. Mini Newtons Cradle Chrome Toy. Specials Today Only. Our cute Mini Magic Girl Robot walks and waddles on her flat silver feet.

Magic Girl has a secret mi.. Our Mini Lilliput Robot is a cute and tiny version the original tin toy robot. Just like the large L.. Wind up our LIttle Police Car with its big key to watch it patrol away! Our tin tiny black and white.. Japanese Ambulance Car Vintage Toy.

Rush to the emergency! Made in Japan. This all tin friction car has rubber wheels and a black and.. Rush to the defend and protect! Featuring an American style police logo, this all tin..

Our yellow Dizzy Duck rolls around in a random pattern as if he is looking for something. If you are looking to learn more fun games like this, we highly recommend checking out our Scratch coding classes for kids - you can easily sign up for a free session below. Up next , learn how to make a maze in Scratch. Limited Time! Shop Now. Enjoy customizing your Scratch pong game tutorial From start to finish, this game will take you about an hour to create.

Just answer this list of questions to customize your game plan ahead of time: What backgrounds do you want for your game?

What color or type of ball do you want to use for your pong game? What message do you want to use to end your game? Follow step-by step instructions for creating a Scratch pong game Let's get started with step-by-step instructions to make your awesome game! Choose a new backdrop To begin, choose a backdrop in Scratch. Select it, and then pick the backdrop you want.

Add a bright color line in the backdrop for negative points Now that you have a backdrop up, add a line at the bottom of the backdrop. A ball sprite is recommended, but you are free to choose any sprite you want. Create the score variable Go to the variable block and create one variable named score, to save the score of the pong game. Make your ball sprite bounce around Let's start to code!

Add a paddle sprite To create a paddle sprite, draw it or get it by clicking the choose a sprite icon. Hover on the choose a sprite icon or click the paint new sprite icon. Draw a horizontal rectangle with the rectangle shape. Fill it in with any color and name the sprite paddle. Choose a line sprite and change the size and color with the help of costume drawing features.

Control the paddle sprite with the mouse pointer 7. Control the paddle sprite with the mouse pointer Create a code for the paddle sprite. Add code to bounce the ball off the paddle We need to code when the ball will bounce off the paddle and touch the red line on the backdrop.

Calculate the score To calculate the score we need to set the score variable to zero. Underneath add the set score by -1 block from variable blocks. End the game and display a winning message When the score is more than , we will switch the backdrop which already has a winning message on it and the game will end here.