Start a new project (bluej's Applet is a decent choice) and give it a separate class "DrawGrid" which extends JFrame.
Our "class DrawGrid" should have the following FIELDS, (with reasonable initial values):
private int widthInCells; /* how many horizontal data elements our array is holding */private int heightInCells; /* how many vertical data elements our array is holding */Color[][] theData; /* our actual data about where black and white and red dots are.This will have to be declared in the DrawGrid constructor(s): theData = new Color[23][42]; (use variables widthInCells and heightInCells instead of 23 & 42). */private int leftMarginInPixels; /* will be used in our paint() method */private int topMarginInPixels;
private int originOffsetXInCells;/* which data-cell column corresponds to Y axis */private int originOffsetYInCells; /* which data-cell row corresponds to X axis */Color currentFgColor = Color.black;
Color currentBgColor = Color.white;
private int cellWidthInPixels; /* will be used in our paint() method */private int cellHeightInPixels; /* will be used in our paint() method */private int pixelsBetweenCells; /* will be used in our paint() method */
Our "class DrawGrid" should have a constructor or two, which (at least) do the following:
public DrawGrid( ) { theData = new Color[23][42]; /* Don't really use 23 and 42. Maybe use some of the variables from above... */ setSize(300,300); setVisible(true); setBackground( Color.lightGray );} // constructor()Our "class DrawGrid" should have (at least) the following METHODS:
void drawDot(double x, double y) { /* this should do only one thing: drawDot(x,y,currentFgColor); */} // drawDot( double, double)/** drawDot uses the currentFgColor, declared above, * which by default is black. This method puts "theColor" * into the appropriate cell of "theData" array. */void drawDot(double x, double y, Color theColor) { /* Warning: in here you have to adjust for origin offset, watch out for "out of bounds", and flip the y coordinates so that they count UP from the origin instead of down from the corner. */} // drawDot( double, double, Color)
void drawLine(double x1, double y1, double x2, double y2) { /* this should do only one thing: drawLine(x1,y1,x2,y2,currentFgColor);} // drawLine(double, double, double, double )void drawLine(double x1, double y1, double x2, double y2, Color theColor) { /* Things to watch out for: vertical line (slope is undefined); steep lines (count by y instead of x); reversed points (if x2 is to the left of x1, and we're counting up by x's then we've got a problem. Alex's suggestion: call again "drawLine(x2,y2,x1,y1,theColor);" */} // drawLine(double, double, double, double, Color)void clear() { /* sets all the cells to currentBgColor */ } // clear()void clear(Color someColor) { /* sets all the cells to the specified color */} // clear( Color)void drawCrossHair(double x, double y){ /* drawCrossHair(x,y,currentFgColor); */} // drawCrossHair(double, double )void drawCrossHair(double x, double y, Color theColor) { /* draws a little plus sign (only need 4 pixels) around the specified point, using the specified color. */} // drawCrossHair( double, double, Color )void setCurrentFgColor(Color newCurrentFgColor) {} // setCurrentFgColor( Color )Color getCurrentFgColor() {} // getCurrentFgColor( )void setCurrentBgColor(Color newCurrentBgColor) {} // setCurrentBgColor( Color )Color getCurrentBgColor() {} // getCurrentBgColor( )void drawCircle(double ctrX, double ctrY, double radius) { /* This just calls "drawCircle(ctrX, ctrY, radius, currentFgColor); */} // drawCircle( double, double, double )void drawCircle(double ctrX, double ctrY, double radius, Color theColor) {
/* Note: loop with y = 0 to (radius * 0.707), using distance formula to find x. You can use symmetry and only have to calculate one eighth of the circle. */ public void paint(Graphics g) { /* loops through our data array, making colored rectangles on the screen. Use no numbers in this method, just variables. This will be the only method we have that gets to use Java built-in graphic functions: g.setColor ( Color.blue ); and g.fillRect( screenX , screenY , cellWidthInPixels, cellHeightInPixels ); */} // paint( Graphics)Color getDot(double x, double y) { /* tells us which color appears at the given location. Note: this will have to round off just like drawDot(). Toby Johnson's idea: return the bg color ("return getCurrentFgColor();") if we're asked for a dot that's out of bounds. */} // getDot( double, double)
The init() method for your main applet will look something like the following:
mikerDrawGrid = new DrawGrid();mikerDrawGrid.clear();mikerDrawGrid.drawDot(0,0);mikerDrawGrid.drawLine(2,0,5,5);mikerDrawGrid.linetest2d();// ... etc.
| When you get the basics working, let's test your drawLine by including the "linetest2d()" method (below). Paste it as a method into your DrawGrid class and call it from your init(). Also test your circle and crosshair and color commands.The result should look like the picture to the right: | (click to see a larger version):  |
void linetest2d( ) //from Miker, API, and David Bloom...{ /* upper right quadrant... */ drawLine( 3, 5, 10, 20, Color.red /* steep, slope > 1 */); drawLine( 3, 3, 20, 20, Color.green /* slope == 1 (45 degrees == pi/4 radians */); drawLine( 5, 3, 20, 10, Color.blue /* shallow, (slope < 1) && (slope > 0) */ ); /* upper left quadrant ... */ drawLine( -3, 5, -10, 20, Color.red /* steep, slope < -1 */ ); drawLine( -3, 3, -20, 20, Color.green /* slope == -1 (-45 degrees) */); drawLine( -5, 3, -20, 10, Color.blue /* shallow (slope < 0) && (slope > -1) */); /* lower right quadrant ... */ drawLine( 3, -5, 10, -20, Color.red /* steep, slope < -1 */); drawLine( 3, -3, 20, -20, Color.green /* slope == -1 (-45 degrees) */ ); drawLine( 5, -3, 20, -10, Color.blue /* shallow, (slope < 0) && (slope > -1) */ ); /*lower left quadrant */ drawLine( -3, -5, -10, -20, Color.red /* steep, slope > 1 */ ); drawLine( -3, -3, -20, -20, Color.green /* slope == 1 */ ); drawLine( -5, -3, -20, -10, Color.blue /* shallow (slope < 1) && (slope > 0) */ ); /* vertical lines */ drawLine( 0, 4, 0, 20, Color.black /* above origin */ ); drawLine( 0, -4, 0, -20, Color.black /* below origin */ ); /* horizontal lines */ drawLine( 4, 0, 20, 0, Color.yellow /* to right of origin */ ); drawLine( -4, 0, -20, 0, Color.yellow /* to left of origin */ );}