Exercise 1: Some Math Functions

The Math class contains a variety of mathematical functions. As a short first exercise, you will write a program named MathFunctions that simply uses a few of those functions. This program has no input at all.

The function Math.random() gives a random number in the range 0.0 to 1.0. So, 100*Math.random() gives a random number in the range 0.0 to 100.0.

Your program should first make a random number in the range 0.0 to 100.0. It should then print out that number and the values of Math.ceil, Math.floor, and two other math functions applied to that same random number. The output of the program might look something like this:

A random number:         87.94480801002243
The next higher integer: 88.0
The next lower integer:  87.0
The square root:         9.37788931530024
The natural log:         4.476709436013197

The file for Exercise 1 must be named MathFunctions.java

double startTime, endTime;
double elapsedTimeInSeconds;

startTime = System.nanoTime();
   .
   .  // do something
   .
endTime = System.nanoTime();

elapsedTimeInSeconds = ( endTime - startTime ) / 1000000000;

Type a line of text, and press return:
A man, a plan, a canal. Panama!
You typed 31 characters in 8.678162827 seconds.
That's 3.572184645297391 characters per second.

Exercise 4 Introduction to JavaFX Graphics

In the last part of the lab, you will get your first taste of GUI programming. At this point in the course, the only thing that you know how to do is to write a "once-through" list of instructions that is executed from beginning to end — but you can do anything with those instructions, as long as you have access to the right subroutines. In this part of the lab, you will use some drawing subroutines that are part of the "GUI toolkit" named JavaFX.

There is a lot about GUI programming that you won't understand for a while, such as how to open windows and respond to the user's actions. But as far as actually drawing on the screen, it all comes down to a bunch of subroutines for drawing basic geometric shapes. The program FirstGraphics.java has a very simple example of this. Your job for this exercise is to replace the drawing commands in that program with commands that will draw a picture of your own design.

The code that draws the picture is inside a subroutine definition named drawPicture, which looks like this:

public void drawPicture(GraphicsContext g) {
   .
   .  // commands for drawing the picture
   .
}

You should ignore everything outside that definition, since you won't understand it at this point. However, what you need to do inside that definition is simply write a list of commands for the computer to execute when the program is run, which is nothing new for you!

Drawing uses (x,y) coordinates, where x goes from zero on the left to some maximum value at the right, and y goes from zero at the top to some maximum value at the bottom. The coordinates can be real numbers, though in practice for this lab, you will probably use integer values for the coordinates. The maximum values for x and y in FirstGraphic.java are 800 and 600. (You can probably see how to change those values if you look through the code outside the drawPicture() subroutine.) The following illustration shows the picture that is drawn when FirstGraphics is run. The picture is in the white area. The numbers and arrows show how the coordinates work. Of course, you can compile and run the program to see the picture at full size.

You should understand how the code in FirstGraphics.java produced this picture before you try to make your own picture.

For the final exercise of the lab, you should modify FirstGraphics.java to draw a different picture. Erase the code inside the drawPicture() routine, and replace it with your own code. (To start, you might want to comment out the code instead of erasing it, so you will have it around for reference. Just enclose it between /* and */. But you should remove the old code before you turn in the program!)

Try to make a picture of some recognizable object, such as a house, a boat, a face, a clock, or a snowman. Maybe use a multicolor background made of two rectangles (representing ground and sky). Add some detail, like a cloud or some stars (stars could be asterisks, or maybe just little ovals). At a minimum, your picture should use at least a dozen commands and several different colors, and you should draw at least one String. Grade will be based partly on ambition and execution—and maybe a little bit on artistic merit, though I'm not really the one to judge that. (But I don't expect you to spend a huge amount of time on this. Some people in past classes may have gone a little overboard on similar exercises.)

You should replace the comments at the start of the program and before the definition of drawPicture() to describe what your program actually does.

The following subroutines are available for you to use in the drawPicture() routine:

• g.setFill(c) is called to set the color to be used for filling shapes. The parameter, c is an object belonging to a class named Color. For example, if you want to fill shapes with red, you would say "g.setFill(Color.RED);" before drawing those shapes. The specified color is used for all subsequent fill operations up until the next time g.setFill() is called. Note that previously drawn shapes are not affected!
• g.setStroke(c) is called to set the color to be used for stroking shapes. It works similarly to g.setFill(c).
• g.setLineWidth(w) sets the size of the pen that will be used for subsequent stroke operations, where w is measured in pixels.
• g.strokeLine(x1,y1,x2,y2) draws a line from the point with coordinates (x1,y1) to the point with coordinates (x2,y2). The width of the line is 1, unless a different line width has been set by calling g.setLineWidth(), and the color is black unless a different color has been set by calling g.setStroke().
• g.strokeRect(x,y,w,h) draws the outline of a rectangle with vertical and horizontal sides. This subroutine draws the outline of the rectangle whose top-left corner is x pixels from the left edge of the drawing area and y pixels down from the top. The horizontal width of the rectangle is w pixels, and the vertical height is h pixels. Color and line width can be set by calling g.setStroke() and g.setLineWidth() some time before the rectangle is stroked.
• g.fillRect(x,y,w,h) is similar to g.strokeRect() except that it fills in the inside of the rectangle instead of drawing an outline, and it uses the color set by g.setFill().
• g.strokeOval(x,y,w,h) draws the outline of an oval. The oval just fits inside the rectangle that would be drawn by g.strokeRect(x,y,w,h). To get a circle, use the same values for w and for h.
• g.fillOval(x,y,w,h) is similar to g.strokeOval() except that it fills in the inside of the oval instead of drawing an outline.
• g.setFont( Font.font(N) ) sets the size of the font that will be used in subsequent calls to g.fillText() and g.strokeText(). The parameter N give the size of the font. (N is about the height of an upper case letter, in pixels.) The setFont method is actually more general than this, but this is the only way that we will use it for now.
• g.fillText(str,x,y) draws the string str with its lower left corner at the point with coordinates (x,y).
• g.strokeText(str,x,y) draws just the outlines of the characters in str with its lower left corner at the point with coordinates (x,y). This is only really useful if the font is fairly large.

There are many predefined colors for use as the "c" value in g.setFill(c) and g.setStroke(c), including Color.BLACK, Color.GRAY, Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW, Color.CYAN, Color.MAGNETA, and many fancier colors such as Color.FUCHSIA and Color.HONEYDEW. (You will see a list of them if you type "Color." in Eclipse). If you need even more colors, any color can be made from specific proportions of red, green, and blue. The proportions can be given by real numbers in the range 0.0 to 1.0. Here are some examples: Some examples:

g.setFill( Color.color(0.6, 0.3, 0) );   // brownish
g.setFill( Color.color(0.7, 1.0, 1.0) ); // light blue
g.setStroke( Color.color(0, 0.5, 0.5) ); // dark cyan

Most interesting, perhaps, is the idea of using Math.random() to specify some or all of the proportions:

g.setFill( Color.color( 0.0, Math.random(), Math.random() );  // a random green-blue

There are no predefined fonts, but it is easy to specify fonts of different sizes. For example:

g.setFont( Font.font(15) );   // A smallish font.
g.setFont( Font.font(36) );   // A rather big font.
g.setFont( Font.font(72) );   // A huge font.

The file that you turn in for Exercise 4 will be FirstGraphics.java.