Need a little Help

/* I am trying for so long to solve my assignment but I am stuck… need a little help please!
here is my assignment question:
Create a ball of predefined size that bounces around the canvas, reversing directions when
it contacts any edge of the canvas.

  • The ball should start with its center 1/4 of the way from the top of the canvas and 1/4 of
    the way from the left edge of the canvas.
  • The ball should never be able to exit the canvas by any amount.
    • Modify your program so that the ball travels at a specific angle, instead of using predefined
    X and Y speeds.
  • Use a global state variable to store the angle at which the ball is traveling. The
    TOTAL_SPEED of the ball should be 3 pixels per frame. This will
    require trigonometry!
  • Think of the TOTAL_SPEED of the ball as the length of a right angle
    triangle, and then calculate the X and Y speeds of the ball
    using the angle and TOTAL_SPEED .
  • Give the ball a random direction (angle) when the program starts.
  • When the ball hits an edge, you can simply invert its angle (add PI).


//Here is my code

final int TOTAL_SPEED=3;
float angle;
float bounces = 0;
float mousex;
float mousey;
float direction;
float m;
boolean ballMove;

float ballX,ballY; //Its initial position - somewhere “random”
final int B_SIZE = 30; //Its diameter - it will be a circle
final int BALL_COLOUR = #FFFF00; //Its colour - this is “leather brown” maybe

float ballSpeedX; //Move 3 pixels every 60th of a second
float ballSpeedY; //Move only 2 pixels every 60th of a second

void setup(){
ballSpeedX = 3;
ballSpeedY = 2;
ballMove = false;
//direction = PI;


void draw(){

background(0); //Erase the old ball

void drawBall()

{ if (ballMove)



void moveBall()


if (ballX>(width-B_SIZE/2) || ballX<B_SIZE/2 || ballY>height-B_SIZE/2)
if (ballY>height-B_SIZE/2 || ballY<B_SIZE/2)



void mouse()
{if (mousePressed)
{ mousex=mouseX;
ballMove = true;


It might help to vastly simplify your code.

You’ll only need the following variables:

  • The constant TOTAL_SPEED
  • Two floats for the X and Y positions of the ball.
  • One float for the angle of the ball’s movement.
  • One float for the radius of the ball.

This leads to the following code:

final float s = 3; // "TOTAL_SPEED"
float x, y, a, r;

void setup(){
  x = width * .25;
  y = height * .25;
  a = random(TWO_PI);
  r = 15;

void draw(){

void move_ball(){
  x += ???; // TODO - How does the x component of the speed change? It's based on the angle and the total speed!
  y += ???; // TODO - How about the Y component?
  if( x <= r ){ // Left bounce.
    // TODO - What happens when the ball bounces?
  if( x+r >= width ){  // Right bounce.
    // TODO - What happens when the ball bounces?
  if( y <= r ){ // Top bounce.
    // TODO - What happens when the ball bounces?
  if( x+r >= width ){ // Bottom bounce.
    // TODO - What happens when the ball bounces?

void draw_ball(){
  fill( 0,200,0 );

I can’t figure out how to put the angle in this code.

Draw a diagram. You have a ball, which has a center. There’s a direction it’s going in, so draw an arrow from the center to represent the speed. What’s the angle? What parts of the triangle are the X and Y components? Do you know enough calculus?

Post your diagram for more help.

1 Like