DawnPainter—a Gradient Paint Coding Tool

The DawnPainter exploits Java's Graphics2D's gradient paint capability, showing your results and then writing the code for you.

For those of you who have already read this and know what you are doing, we'll start with the application launching applet. If you're new here, read first, then launch.

Applet with DawnPainter's Code	Applet without DawnPainter

Jar size: 30,702 bytes	Jar size: 29,181 bytes

It costs very little to add a contemporary skin to your applet or application with a bit of gradient paint. Here I've added gradient paint to the applet and created a BackPanel class that extends JPanel, adding a gradient paint background. The DawnPainter application uses four BackPanels — the DullDawnPainter uses JPanels. Launch them both, look at these applets and decide if the effect is worth 1,521 bytes.

The applet LaunchDawnPainter is in the applets package. The DawnPainter is in the apps package. It uses BackPanel, WashPanel, IntegerField and ColorChooser from the widgets package.

Just before dawn this morning I was driving east, marvelling at the sky. Mother Nature was doing her version of gradient paint, and it was beautiful. I was thinking that I'd probably use a lot more gradient paint if it weren't so much trouble.

Well, it's trouble no longer. This is the default DawnPainter.

(Actually that's a 22KB .GIF image that replaces a real gradient with individual color bands. The original .TIF image — no bands — was 1.4MB.)

DawnPainter starts with a sample box, showing our peculiar coordinate system. (Non-programmers will expect 0, 0 to be in the lower-left corner or perhaps in the center.) Then it has boxes allowing you to set start and end coordinates and colors. Finishing the input is a checkbox for cyclic. I'll not explain that, since you can click it for yourself and find out. Before you begin, look at the examples to see how many choices you have.

These are the results and the values.

Gradient Paint with blue left, yellow right

Start End Cyclic

X Y X Y

0 0 150 0 no

Gradient Paint with blue top third, gradient middle third and yellow bottom third

Start End Cyclic

X Y X Y

0 50 0 100 no

You don't have to start at the edges.

Gradient Paint with blue top and bottom, yellow center

Start End Cyclic

X Y X Y

0 0 0 75 yes

Gradient Paint with yellow left and right, blue center

Start End Cyclic

X Y X Y

0 0 75 0 yes

Diagonal Gradient Paint with blue top-left and yellow bottom-right

Start End Cyclic

X Y X Y

0 0 150 150 no

You can go in any direction.

Start End Cyclic

X Y X Y

0 0 75 75 yes

Gradient Paint with alternating blue and yellow bands

Start End Cyclic

X Y X Y

0 0 0 30 yes

Cyclic gradients repeat.

Diagonal Gradient Paint with alternating blue and yellow bands

Start End Cyclic

X Y X Y

0 0 30 30 yes

Now that you see what can be done, go ahead and launch the application and try some on your own. You can do very sophisticated, elegant work with this tool. You can also do horrible, garish things. It's in your hands now.

Programming with DawnPainter

Each of the examples was coded by the DawnPainter. I just keyed in the non-default x and y values, clicked the Cyclic button (as needed) and then clicked the Write Code button. The correct gradient paint code pops up instantly. This is what it looks like:


	/** Paint the .
	 * @param g The Graphics context.
	 */
	public void paintComponent( Graphics g ) {
	
		Graphics2D g2d = (Graphics2D) g.create();
	
		GradientPaint gp = new GradientPaint
			( 0, 0, new Color(0, 0, 136), 
			  0, 300, new Color(240, 240, 0), 
			  true );
	
		g2d.setPaint( gp );
		g2d.fillRect( 0, 0, getWidth() - 1, getHeight() - 1 );
	
	} // end of paintComponent()/

From there I copied it into my GPDemo program and ran the demo. I didn't copy the javadoc and method header, just the internals of the method.

I created a BackPanel class that extends JPanel and overrides paintComponent() to do a GradientPaint. Did you notice the sophisticated skin on the dialog portion of DawnPainter? That's done with a background wash from the top down to the Code button. Each of the component panels has a wash in the same color from top to bottom.

If you haven't created a paintComponent() method you could copy the whole thing. Just add a few sensible words describing what you're painting at that hole in the javadoc.