Home

Drawing images

Drawing images

To draw something, you first need a canvas to draw on. We will use java.awt.image.BufferedImage, which you create by providing the desired width and height in pixels.

Then we obtain the java.awt.Graphics2D object for drawing to this image. The Graphics2D object provides plenty of functions for drawing shapes, images, and text, discussed below.

When you are done drawing, you can save the image to a file using the javax.imageio.ImageIO.write function.

Here is a complete example that shows some drawing functions (drawing.scala): 

import java.awt.image.BufferedImage
import java.awt.{Graphics2D,Color,Font,BasicStroke}
import java.awt.geom._

// Size of image
val size = (500, 500)

// create an image
val canvas = new BufferedImage(size._1, size._2, BufferedImage.TYPE_INT_RGB)

// get Graphics2D for the image
val g = canvas.createGraphics()

// clear background
g.setColor(Color.WHITE)
g.fillRect(0, 0, canvas.getWidth, canvas.getHeight)

// enable anti-aliased rendering (prettier lines and circles)
// Comment it out to see what this does!
g.setRenderingHint(java.awt.RenderingHints.KEY_ANTIALIASING, 
		   java.awt.RenderingHints.VALUE_ANTIALIAS_ON)

// draw two filled circles
g.setColor(Color.RED)
g.fill(new Ellipse2D.Double(30.0, 30.0, 40.0, 40.0))
g.fill(new Ellipse2D.Double(230.0, 380.0, 40.0, 40.0))

// draw an unfilled circle with a pen of width 3
g.setColor(Color.MAGENTA)
g.setStroke(new BasicStroke(3f))
g.draw(new Ellipse2D.Double(400.0, 35.0, 30.0, 30.0))

// draw a filled and an unfilled Rectangle
g.setColor(Color.CYAN)
g.fill(new Rectangle2D.Double(20.0, 400.0, 50.0, 20.0))
g.draw(new Rectangle2D.Double(400.0, 400.0, 50.0, 20.0))

// draw a line
g.setStroke(new BasicStroke())  // reset to default
g.setColor(new Color(0, 0, 255)) // same as Color.BLUE
g.draw(new Line2D.Double(50.0, 50.0, 250.0, 400.0))

// draw some text
g.setColor(new Color(0, 128, 0)) // a darker green
g.setFont(new Font("Batang", Font.PLAIN, 20))
g.drawString("Hello World!", 155, 225)
g.drawString("안녕 하세요", 175, 245)

// done with drawing
g.dispose()

// write image to a file
javax.imageio.ImageIO.write(canvas, "png", new java.io.File("drawing.png"))
The generated drawing looks like this:

The resulting drawing

Colors

Colors are specified using a java.awt.Color object. There are some predefined colors:

To create another color, provide its red, green, and blue components, as integers between 0 and 255: 
val color = new Color(0, 200, 0)  // slightly darker green

Fonts

To draw text, you need to set a java.awt.Font on the Graphics2D object using setFont. The easiest way to create a font is by providing a name, style, and point size like this: 

val font = new Font("Serif", Font.BOLD, 16)
For the name, you can use the standard names "Monospaced", "Serif", or "SansSerif", or the name of a real font installed on your system. You can also use null to use a default font.

For the style, use the constants Font.PLAIN, Font.BOLD, or Font.ITALIC.

Graphics2D

The java.awt.Graphics2D object is the most important part of drawing.

Usually, you will like to turn on anti-aliasing for your drawings (meaning that pixels can be "partially filled"): 

g.setRenderingHint(java.awt.RenderingHints.KEY_ANTIALIASING, 
		   java.awt.RenderingHints.VALUE_ANTIALIAS_ON)
Try your code both with and without this to see the effect!

The most important methods are:

Shapes

For the draw and fill methods of Graphics2D, you will need shape objects. Here are constructors for the most important ones (all arguments are Double unless otherwise indicated):