CPSC223N-Assignment 4 Ricochet Ball Solved

The goal for the semester is to provide you a basic foundation in programming graphic output.  This assignment extends your animation stills began developing in previous programming asssignment.

Background
Think of your graphic area as the top of a billiard table.  When the cue ball hits the edge of the table it ricochets off the edge and continues traveling in another direction.  In a real billiards game friction will make the ball eventually stop moving or perhaps the ball falls into a pocket, and then it has obviously stopped moving.  In this assignment 4 we assume there are no side pockets and no friction.  Here the ball keeps moving forever at the same constant speed: well, actually it moves until you click on the new button or the exit button.

 

 

What you will experience in this homework

 

1.  A better understanding of how refresh rate and motion rate are different.

 

2.  A better understanding of the relationship among three quantities:

          ball speed (pix/second)

          ball speed (pix/tic)

          animation clock speed (tics per second.

 

3.  How to (mathematically) bounce a ball off of a hard flat surface such as a wall.

 

4.  How to convert traditional angles into computer graphic angles.

 

 

Basic requirements

 

Make a user interface similar to the diagram in this document.  This interface will have a small header panel at the top, a large graphic panel in the middle, and a medium size control panel at the bottom.  When the interface first appears there are no objects in view.  The plane background of the graphical area is the only thing visible.

 

 

A picture is better than words

 

The next page has an artist's conception of the appearance of the form.

 

Sample User Interface

This image was made by Libre Office word processor from www.libreoffice.org and saved in open source format “.odt”.  Sometimes when odt files are opened in closed source word processors the images do not display correctly.

Description of the components of the user interface

 

1.  At the top there is a thin rectangle that holds the title and your name.  You choose a height for this rectangle.

 

2.  In the middle is a large rectangle which represents the top of the billiard table.  You choose its height.  Don’t make it small.  A height of 800 or more is ok.

 

3.  The bottom of the frame is a rectangular area where the controls are placed.  You pick a good height for the control panel.

 

4.  When a user clicks on “New” all the input fields are set to blanks and a small red ball with a radius equal to 5 pixels appears in the center of the green graphical area.

 

5.  In the speed box the user enters the motion speed of the ball.  This number is often called the “linear speed” of the animated object.  Motion speed is measured in pixels/second.

 

6.  The direction input box is expecting to receive a number of degrees.  The ball will initially travel in the direction of the inputted number.  The inputted number should be stored in a variable of type double.

 

Material for lecture:  The user of your software expects the coordinate system to be the standard one used in mathematics.  That is, zero degrees is the positive x axis, and as degrees increase they rotate in a counter-clockwise direction.  However, the computer coordinate system is upside down.  You have to adjust for this upside down feature.  For example, if the user inputs 30 degrees as the direction for the ball to travel then the ball moves in an upward direction toward the right.  The computer science coordinate system would say to move the ball downward, and that is not acceptable.

 

7.  When the user clicks on the start button then the two input numbers are read:  speed and direction.  Using those two numbers the ball starts moving in the given direction.

 

Material for lecture:  How to set the animation clock speed.

 

8.  When the ball reaches one of the four walls it bounces off the wall and continues.   We say that the ball ricochets off of the wall.  Then the ball continues in straight line in a new direction until it ricochets off of another wall.  This ricochet action continues until the user clicks on “Quit” or clicks on “New”.

 

9.  If the user clicks on Quit then the frame closes.  If the user clicks on New then ball stops and all the input fields become blank.

 

11.  While the ball is moving the coordinates of the ball are displayed in the X and Y output fields.  Remember to output the coordinates of the center of the ball – not the coordinates of the upper left corner of the ball.

 

 

Math for computer graphics

 

When a user inputs a direction such 58.5 degrees the program has to make several calculations like these.

 

A.  Convert the input degrees to radians.  We’ll call the radian number Θ.

 

B.  Let  S be the linear speed of the ball in pix/sec.  This is an input from the user.

Let  M be the rate of the motion clock in tic/sec.  This is set by the programmer.

 

C.  Compute C = S/M, which is called speed of ball measured in pix/tic.

 

D.  Compute delta x and delta y using right angle trigonometry:

 

            deltax = C*cos(Θ)

 

            deltay = C*sin(Θ)

 

Each time the motion clock tics the amount deltax is added to the x coordinate of the ball, and deltay is added to the y coordinate of the ball.

 

In the two equations above “direction” is the angle in radians in which the ball is moving relative to an invisible x-axis.