Activity 7.5 - Experimenting with animation

Topic

In this activity we experiment with animation.

Materials

We have provided two classes:

• Logo, which represents an Open University logo resembling a small-scale version of the second logo seen in Activity 7.3. However this version of Logo has added methods which make it move:
• goToPosition(int x, int y) moves the logo to (x,y);
• right() moves the logo one pixel to the right;
• left() moves the logo one pixel to the left;
• up() moves the logo one pixel upward;
• down() moves the logo one pixel downward;
• StarrySky which is a panel providing a background of "stars".

Here we see the logo against the night-sky backdrop.

Tasks

1. Write a program that will cause a logo to fly round, describing the four sides of a square of size 200 x 200 and return to its original position.

2. Write a program that will make the logo follow a figure-of eight path. Each leg represents a movement of 50 pixels horizontally and 50 vertically.

   

3. Write a program that will create two separate windows with moving logos in.

Instructions

Open the classes Logo and StarrySky and inspect the constructors to see what arguments are required.

Carry out the following steps to complete the first task:

1. Add a new class FlyingLogo to the current project Ex7_5. FlyingLogo should extend JFrame. The frame width and height should be 400, and the location should be (100,100).

2. Add two instance variables which will reference a Logo instance and a StarrySky instance respectively. Initialise these with a Logo object, and a StarrySky object with 200 stars and the same width and height as your frame.

3. Complete the FlyingLogo constructor so that it:

   • sets the title, frame size, location etc. in the usual way;
   • adds the StarrySky object to the content pane;
   • moves the logo to (100,100).

4. Write a paint method which overrides the inherited one and is responsible for first painting the frame, then the logo.

5. Write a squareMove() method that will use for loops to send the logo:

   • 200 steps to the right;
   • 200 steps down;
   • 200 steps to the left;
   • 200 steps up.

   Each step should include a call to Thread.sleep(), to provide a suitable delay while the system repaints the window. Use the class MovingBall as discussed in the Unit as a guide to how this is done.

6. Now add a class FlyingLogoTest with a main() method which will instantiate a FlyingLogo object with title "Open in space", make it visible and invoke squareMove on it.

7. Run the program setting ex7_5.FlyingLogoTest as the main class.

In order to carry out the second task:

1. Add a method figureOfEight() to FlyingLogo. Change FlyingLogoTest so it invokes this method instead of squareMove().

In order to carry out the third task:

1. In class FlyingLogoTest, create another instance of class FlyingLogo, named world2. Before making this frame visible, make sure that it is located at position (500,100) using the appropriate accessor method.

2. In FlyingLogoTest set both frames to visible, then invoke the figureOfEight() method on each of them in turn. Observe what happens. The second logo does not set off until the first logo has finished moving. This is because the program only has a single thread of execution - it can only do one task at once. In the next unit we shall see how to make them both move at the same time.

For our sample solution, see classes FlyingLogo and FlyingLogoTest in the Solution file.