» CS 148 Lab 9 – Spinner

CS 148 Lab 9 – Spinner

November 6, 2019 by Chris Johnson. Filed under cs1, cs148, fall 2019, labs.

Welcome to lab 9!

Our goal in this lab is to continue our discussion of loops, but also get some more practice with images and the GifSequenceWriter that you are using in homework 4. Because we’re going to use some code that I’ve provided to you in the homework 4 SpecChecker, you’ll need to complete this lab in the same project that you’ve been using to complete the homework.

If you have checkpoints from the last lab to show your instructor or TA, do so immediately. No credit will be given if you have not already completed the work, nor will credit be given after the first 10 minutes of this lab.

Checkpoint 1

Person A types.

Your task is to programmatically generate a spinner animation. A spinner is an image that shows the progress or activity of some long-running task, like the spinning beachball of macOS. Check out some of the following websites:

Create a labs.lab09 package in your project, and create a separate class named Spinner.

generateFrame

Give Spinner a method generateFrame that accepts an int that represents a timestep or a frame number and returns a BufferedImage. Create and return a brand new BufferedImage with dimensions of your choosing. Give it an RGB pixel format. The image will be all black.

main

Write a main method that creates a GifSequenceWriter. When you reference GifSequenceWriter for the first time in your code, IntelliJ will show it in red because it’s not a class it knows about yet. This class is provided to you in the homework 4 SpecChecker. Click on the red lightbulb icon that shows up and select Add library hw4.jar to classpath.

Have the writer write to a file on your desktop, like this one:

File dst = new File(new File(System.getProperty("user.home")), "Desktop/spinner.gif");

Inspect the methods that you can call on a GifSequenceWriter. Make your writer loop and set its delay.

Then, iterate through a sequence of timesteps, like 0 through 10, or 0 through 100. The exact value of the upper bound is not so important right now—just pick something and tweak it later. On each timestep, call your generateFrame method to produce a single frame of your animation at the given timestep. Append the frame to your GifSequenceWriter. After all frames have been generated, close the GifSequenceWriter.

Checkpoint 2

Person B types.

Your task is to implement the generateFrame method so that it draws a single frame of your spinner animation based on the time parameter that it is given. Complete the following tasks in generateFrame:

Create a BufferedImage of some fixed size. Aim for three-digit dimensions; the web server imposes a modest maximum file size. Every time this method is called, an image of the same size should be generated.
Draw on your image some indication of progress as a function of the timestep parameter. For example, if your progress indicator is an hourglass, the sandy-colored pixels will be at the top of the image when the timestep is early in the animation, and at the bottom later on. If your progress indicator is a rotating wheel, then the rotation angle should be computed using the timestep. Be creative. You can fill the pixels manually, or you can use the Graphics2D drawing methods to draw shapes. For the latter, turn a BufferedImage into a drawing canvas like this:
```
Graphics canvas = image.getGraphics();
canvas.setColor(...);
canvas.fillOval(...);
```
Let your partner’s loop advance through the animation and write it out to an animated GIF. Upload it.