Scenes Assignment

Grading rubric

So 50 points is a perfect score, but you may earn up to 65/50 points if you do the BONUS as well.

Stage 0. Study your goal.

In the final stage, you will draw a scene consisting of some houses, trees, a sun, and the sky and grass in the background:

Houses Tress and Sun
Houses Tress and Sun

You will draw the houses, trees, and sun in isolation, then put them all together.

Consider houses first. There are 3 classes:

A House can draw itself. It provides the following method to encapsulate that behavior:

/**
* Draws the House onto the given Graphics2D object.
* 
* @param graphics2
*            Graphics object onto which to draw
*/
public void drawOn(Graphics2D graphics2) {
    <em>// ... code elided ...</em> 
}

A HousesComponent class draws some House objects

A HousesViewer class constructs and displays a HousesComponent

Stage 1. Houses

HousesAppear
HousesAppear

You have been given the House, HousesViewer and HousesComponent classes.

House is only partially implemented

Stage 2a. Create PineTreesViewer and PineTreesComponent

Add the PineTreesViewer and PineTreesComponent to your project

Stage 2b. Creating the PineTree class

Before we start putting together a PineTree, here are some notes about how a PineTree is drawn:

It should look like this when you run PineTreeViewer:

Some Trees
Some Trees

Stage 3a. Create SunViewer and SunComponent

Add the SunViewer and SunComponent to your project

Stage 3b. Creating the Sun class

Before we start putting together a Sun here are some notes about how a Sun is drawn:

Create the Sun class

  1. Add the following constants to the Sun class:

     private static final Color BORDER_COLOR = Color.BLACK;
 private static final int NUMBER_OF_RAYS = 8;
 private static final double RAY_LENGTH_SCALE = 0.5;
 private static final double RAY_WIDTH_SCALE = 0.1;
 private static final double RAY_DISTANCE_FROM_SUN_SCALE = .2;
 private static final double DEFAULT_SUN_DIAMETER = 100.0;
 private static final double DEFAULT_SUN_X = 100.0;
 private static final double DEFAULT_SUN_Y = 100.0;
 private static final Color DEFAULT_SUN_COLOR = Color.YELLOW;
 private static final double LITTLE_SUNS_X_OFFSET = 50;

  2. Add the following instance fields to the Sun class:

  1. Create a default constructor for the Sun class.

Stage 3c. Draw your first sun

Default Sun without rays
Default Sun without rays

Default Sun without rays

Default Sun with rays
Default Sun with rays

Default Sun with rays

  1. In the SunComponent’s paintComponent method, create a Sun using the default (parameterless) constructor, then draw it to the component by calling the drawOn method. (Hint below if you get stuck.)
  2. In the Sun’s drawOn method, draw the center circle for the Sun based on its x and y values and the circleDiameter.
  3. Draw the rays in for the circle.

Stage 3d. Drawing more suns

With guide rectangles to verify sun positioning is correct
With guide rectangles to verify sun positioning is correct

With guide rectangles to verify sun positioning is correct

Adding little suns!
Adding little suns!

Adding little suns!

  1. Test that your positioning is working properly. Add this code to SunComponent’s paintComponent method:

     //draws a rectangle around the default sun
 g2.drawRect(30, 30, 240, 240);

 //draws a rectangle around a new sun in a particular position
 s = new Sun(550, 100, 50, Color.BLUE);
 s.drawOn(g2);
 g2.drawRect(515, 65, 120, 120);

    Don’t modify the parameters in the above code! If the Sun position and the rectangle don’t match, the problem is the way you are drawing suns!

  2. Modify SunComponent’s paintComponent method to create multiple little Suns (use NUM_LITTLE_SUMS for the exact number), and draw them to the screen

  3. For your final submission, make sure your paintComponent() do the following so that we can check that it looks like the final sun picture:

     @Override
 protected void paintComponent(Graphics g) {
     super.paintComponent(g);

     // Get the 2D graphics object
     Graphics2D g2 = (Graphics2D)g;
     // Create a Sun using the default (parameterless) constructor, 
     // then draw it to the frame
     Sun s = new Sun();
     s.drawOn(g2);

     // Draw a rectangle around the default sun
     g2.drawRect(30, 30, 240, 240);

     // Draw a rectangle around a new sun in a particular position
     s = new Sun(550, 100, 50, Color.BLUE);
     s.drawOn(g2);
     g2.drawRect(515, 65, 120, 120);

     // Draw little suns
     double x = SunComponent.LITTLE_SUNS_X_OFFSET;
     for (int i = 0; i < SunComponent.NUM_LITTLE_SUNS; i++) {    
         s = new Sun(x,
               SunComponent.LITTLE_SUNS_Y,
               SunComponent.LITTLE_SUN_SIZE, 
               SunComponent.LITTLE_SUN_COLOR);
         s.drawOn(g2);
         x+= SunComponent.LITTLE_SUN_SEPARATION;
     }
 }

Stage 4a. Create the SceneViewer and SceneComponent

In this pat, you’ll put it all together!

  1. Create the SceneViewer and SceneComponent using the same process as for Houses, PineTrees and Suns

Stage 4b. Create Scene

  1. Create a sky for the Scene by drawing a blue rectangle in the upper 375 pixels of the component.
  2. Create grass for the Scene by drawing a green rectangle in the rest of the component.

Stage 4c. Finish Scene

Scene with trees
Scene with trees
  1. Add a Sun at the default location to the SceneComponent.
  2. Create a row of red houses in the foreground, evenly spaced so that they don’t overlap, as shown. Loops are your friend!
  3. Create a row of 25 little pine trees (10 pixels x 40 pixels) behind the houses on the horizon.
  4. Create a row of 15 bigger (20 pixels x 80 pixels) in front of the first trees.
  5. (Optional) If you want to make them look more natural, you can randomize the x and y coordinates of the trees by a little bit. That’s how I got the image at the top of this page. Your textbook has info on the Random class (or see the Java API, of course).

Stage 5. Rotatable Faces (BONUS)

Translated and rotated faces appear
Translated and rotated faces appear
  1. Create a Face class, FacesViewer class, and FacesComponent class.
  2. The geometry on this one is more complex than the others, using an Arc2D.Double for the mouth. The Geometry of a Face" diagram gives numbers to use to construct the Face.
  3. Draw some faces in upright position. They can be whatever size and color you like, placed wherever you like, as long as they test your FacesComponent and Face classes adequately for this stage (so use different positions, radii, colors, etc).
  4. Implement a translate(double x, double y) method that translates the Face’s position by the amounts given in the arguments.

  5. Implement a rotate(double angleToRotate) method that rotates the Face by the number of degrees given in the argument.