Objectives

Creating methods with parameters.

Drawing  Square Tiles

This drawing of 4 square tiles:

was created with this code:

import java.awt.*;

public class TileStart {

    public static void main(String[] args) {
        DrawingPanel panel = new DrawingPanel(310,190);
        Graphics2D g = panel.getGraphics();        

        verticalTile(g, 10,10, 50);     // small
        verticalTile(g, 70,10, 50);     // small
        verticalTile(g, 10,70, 110);    // medium
        verticalTile(g, 130,10, 170);   // large
    }

    // draw a tile with 5 vertical stripes (regions)
    // with upper left corner at (x,y) of size by size pixels
    public static void verticalTile(Graphics2D g, int x, int y, int size) {
        // draw border rectangle
        g.setColor(Color.BLACK);
        g.drawRect(x, y, size, size);

        // draw 4 vertical lines at 1/5, 2/5, 3/5, and 4/5 the width
        for (int i = 1; i <= 4; i++) {
            int dx = size * i/5;     // delta x is the offset from the left edge
            // line from top point (x+dx,y) to the bottom point (x+dx,y+size)
            g.drawLine(x+dx, y, x+dx, y+size);
        }
    }
}

Study the code and make sure you understand it. It has a method verticleTile(...) that draws a tile with 5 vertical regions. It has a main(...) method that calls the tile drawing method 4 times (two small tiles, a medium sized tile, and a large tile). I left a gap of 10 pixels between the tiles and around the sides to represent the grout lines as if you were tiling a wall.

Cut and paste this code into Eclipse along with the DrawingPanel and run it. This will be the starting code for your program. You are going to create two more tile methods and then draw a design using your methods.

Part 1 (10 points) Your first tile

Create another method to draw one of these example tiles:

Choose an appropriate method name. Whichever pattern you choose, it should have the same 4 parameters: the graphics object (g) for the drawing panel, the x and y coordinates of the upper left corner, and the size of the tile in pixels.

Two important mathematical ideas are:

Reference point: The series of objects are all drawn relative to a certain edge, corner, or the center. For the vertical tile example above, the lines were drawn relative to the left edge.

Scaling: As you loop though drawing the parts of your tile, their sizes (or offsets) will be scaled fractions of the size. For the vertical tile the vertical lines were drawn at offsets: 1/5, 2/5, 3/5, and 4/5 of the size.

Write your tile drawing method, and then modify the starting code to call your tile instead of the vertical tile.

Turn in your tile method code and a screenshot of the drawing panel.

Part 2 (10 points) Draw a second type of tile

Next create another tile method to draw a tile from this set:


These are a little trickier than the previous set. For some I used the Graphics2D drawArc(...) or drawPolygon(...) methods (see the Java Graphics API documentation at https://docs.oracle.com/javase/10/docs/api/java/awt/Graphics.html).

Again test your method using the starting code, and turn in your new tile method code and a screenshot of the drawing panel.

Part 3 (10 points) Create a design with your tiles.

Using loops, draw a design that completely fills a drawing panel with non-overlapping tiles.

Be creative! Use at least 50 tiles. A mix of both of your tiles from above, plus create more tile designs if you want.

Extra Credit (5 points) Color it.

Fill the regions between the lines with colors. Each tile should use at least two colors and make the tile design stand out. You may want to add extra parameters to your methods to specify the colors.

Hint: To avoid partially obscuring the black lines, first fill all of the colored regions of a tile, and then draw all of the black lines on top.

Note: For the tile designs with diagonal lines, you will need to use fillPolygon(...).

What to turn in
  1. Your results from Parts 1 & 2.
  2. For Part 3 your complete final code and a screenshot of your design.
  3. If you did the extra credit, your code and a screenshot of that.