Last Update: Nov. 1, 2025

Assignment 4 (PS4): Animation, Methods with Return

This assignment focuses on methods with parameters and returns. It will use methods in the StdDraw class, the Math class, and the printf method.

Due: 11:55 PM, Sunday, Nov. 9, 2025.

• Grading rubric
• Elements of programming style

Part 0: Draw Animations with StdDraw.

Part 1: Utilization of Breakpoints for Debugging.

Part 2: CafeWall

For the second part of the assignment, we will use StdDraw.java to explore something that is known as the Cafe Wall illusion (as described in http://mathworld.wolfram.com/CafeWallIllusion.html or http://en.wikipedia.org/wiki/Cafe_wall_illusion). You are to produce the image below. The canvas has a size of 650 pixels by 400 pixels and has a gray background. We scale the coordinate so that x is from 0 to 650, and y is from 0 to 400. Note that (0,0) is at the lower left corner of the canvas.

This image has several levels of structure: Black and white squares are used to form rows and rows are combined to form grids. The image has two free-standing rows and four grids.

You should first write a method named drawRow to produce a single row. Each row is composed of a certain number of black/white pairs of boxes where each black box has a blue X in it. The free standing rows in the output have the properties shown in the table below:

We specify each row by its (x, y) position, number of pairs, and box size. The (x, y) position refers to the coordinate of the lower left corner. Your method does not have to be able to produce a row that has a different number of black versus white boxes. The boxes are specified using a single size parameter because each should be a square. Your drawRow method will take the four parameters, use one or more for loops to produce any of the various rows.

Once you have completed drawRow, write a method named drawGrid that produces a grid of rows by calling your row method appropriately (you will again use one or more for loops to solve this task). Grids are composed of a series of pairs of rows. The display has four grids with the following properties:

Each grid is a square, which is why a single value (number of pairs) indicates the number of rows and columns. For example, as the table above indicates, the lower-left grid is composed of 4 pairs. That means each row has four pairs of black/white boxes (8 boxes in all) and the grid itself is composed of 4 pairs of rows (8 rows total). A single box size is again used because each box should be a square. Note that for each pair of rows, the lower row has an offset to the right compared with the higher low. The offset indicates how far the offset is. The figure in the lower-left has no offset at all. The grid in the upper-right is offset by the size of one of the boxes, which is why it has a checkerboard appearance. The other two grids have an offset that is in between, which is why they produce the optical illusion (the rows appear not to be straight even though they are). For the (x, y) position value of each grid, x gives the x coordinate of the higher row of each pair, and y gives the y coordinate of the lowest row of each grid.

Each pair of lines in the grid should be separated by a certain distance, revealing the gray background underneath. This is referred to as the mortar that would appear between layers of brick if you were to build a wall with this pattern. The mortar is essential to the illusion. Your program should use 2 pixels of separation for the mortar, but you should introduce a program constant that would make it easy to change this value to something else.

Implement the two methods (and additional methods you see fit). Please use CafeWall.java as a starting point of your code. We will expect you to use good style (indentation, commenting, good variable names, etc) and to include a comment for the class and for each method.

You need StdDraw.java from the class Schedule page. We recommend that you read the javadoc of StdDraw to learn more about its methods. To use StdDraw, please follow the direction below according to your programming setting:

• If you are using command line to compile, save StdDraw.java in the same folder as your programs. You need to compile StdDraw.java first, and then compile your own program.
• If you are using Dr. Java, save StdDraw.java in the same folder as your programs. You need first open StdDraw.java and compile it. Then you compile your own program and run your program.
• If you are using eclipse, please create an Eclipse project: File -> New -> Java Project. Please choose a Project name such as "Drawing"; to simplify settings, please choose "Use project folder as root for sources and class files" for Project layout. Save StdDraw.java to the project directory (Drawing). If you first downloaded StdDraw.java somewhere. Please drag it to the project. If StdDraw.java does not appear, right click on the project and Refresh.

Part 3: Animation

For the first part of this assignment, you will write a Java program that produces animation effects.

Part 3.1: Parameterized Figure

First, design a parameterized method that draws a figure of your own design. The figure should have at least three components with at least two colors. The parameters of the method should include x and y to specify the lower-left position of the figure. Do not make the figure too large. We suggest a size around 50 to 100, but it is up to your design.

Part 3.2: Animation Parameters

Second, setup specific parameters for the animation as follows:

• Set the dimension (width and height) of the canvas. We suggest a size around 400 to 600 pixels.
• Set the parameters of your parameterized figure: first the initial position (initial x, initial y); and then the moving speed (pixels/second) and angle (in degrees such as 90) of your parameterized figure. You need to think which Math function(s) to use to turn the speed, angle combination into the horizontal and vertical speeds as we used in class. Hint: sin and cos. Please find the basic use of Math class from Math class.
• Set the name (String) of a .wav audio file to be played during the animation. To play audio, you need to download and save StdAudio.java. See CarLaunch on how to use StdAudio.
• Finally, set the number of seconds to count down.

Part 3.3: Countdown Scene

After obtaining the parameters, your program will start a count-down phase which lasts specific count-down seconds. During the count down, the parameterized figure and the image will be shown at the initial position and still. Your program will display a count-down clock, with a hand rotating clock wise, at a rate of reducing by 1 per second, with a text at the end of the hand showing the remaining seconds. Below is a screen shot. You are more than welcome to make it look nicer, as long as you satisfy the spec below.

We ask for the following spec for the count-down clock.

• The center of the clock must be at the center of the canvas.
• The radius should be a quarter of the min of the width and the height of the canvas.
• You need to implement the method drawClock to draw the clock, where (cx, cy) specifies the center of the clock, radius is the radius, n is the total count-down time, and t is the remaining count-down time:

    public static void drawClock(double cx, double cy, double r, int n, int t) {
    

Part 3.4: Basic Animation

After the count down, your program "moves" the figure and the image for 10 seconds, while at the same time playing the audio file. Note that the world has no gravity, unlike the class example. Your program should use a frame rate of 50 ms per frame.

Please name your program Animation.java.

Part 4: Submit Your Assignment

Please submit electronically for assignment #4 and make sure you submit (1) CafeWall.java, and (2) Animation.java. Please be sure that you choose the .java file, NOT the .class file when uploading. The .class file is the compiled version of your code which we cannot examine and grade. So, please make sure you submit *.java files. Also, remember that you always need to include the header.

    //*******************************************************************
    //
    //   File: FileName.java          Assignment No.: 4
    //
    //   Author: <your name>      Email: <your email>
    //
    //   Class: ClassName
    // 
    //   Time spent on this problem: 
    //   --------------------
    //      Please give a description about your design. 
    //
    //*******************************************************************

The submission repository for ps4 is https://gitee.com/simmonsong/ct-xmuf25-ps4.

Please follow the instructions in Assignments Submission to submit your assignments.

Git introduction is a help document for git utilization..

Enjoy!