Creating Custom Cursors

Earlier in this chapter you learned several ways to draw with Graphics2D. This section puts those ideas together in one practical example: a custom mouse cursor. The source shows a method that sets the cursor of a component to a red square whose interior is transparent. Whatever sits underneath the cursor shows through the middle of the square.

The example is presented as a fun demonstration, but it touches the core ideas of this module. To understand why the interior can be see-through, you first need to know how Java represents transparency in an image. Keep that question in mind as you read the next section, because the whole cursor depends on it.

Think of a single pixel as one color value made of four parts. Three of the parts describe the visible color, which is red, green, and blue mixed together. The fourth part, alpha, does not describe a color at all. It describes how much of that pixel is allowed to show. Every pixel in an ARGB image carries all four parts at once, so transparency is a property of each individual pixel rather than of the whole image.

The diagram shows the four components side by side in the order given by the name. Alpha is the first component, and it is the one that decides whether the other three are visible at that position.

The source states the key rule directly: a color with zero alpha is fully transparent. A pixel whose alpha is zero contributes nothing visible, so the background behind it shows through. The source also names the image type that supports this. BufferedImage.TYPE_INT_ARGB is the image type used when transparency is needed.

The source shows the method that creates the cursor. It builds a 24 by 24 image, draws three concentric red rectangles to form a thick border, and then hands the image to the Java toolkit as a custom cursor. The method has two inputs for the toolkit: the image and a hot spot. Everything else in the method exists to produce the image.

Read the stages as a chain of data flow. First the image type makes transparency possible. Next the zero-alpha background decides which pixels start out transparent. Then the red drawing calls decide which pixels become visible, forming the square outline. Finally the hot spot tells the system which point of the image is the actual click point of the cursor.

A useful way to see the result is to look at the pixel grid. The diagram below is an illustrative excerpt of one row across the cursor, not the exact 24 by 24 geometry from the source. It shows the pattern that the method produces: the drawn border cells are opaque, and the cells the drawing never reached keep their zero alpha from the background.

The boundary sits where the red drawing stops. Pixels inside the square are the ones the drawing calls never reached, so they keep the zero alpha that the background gave them. Pixels on the ring are the ones the drawing calls covered, so they are visible. Predicting the transparent region therefore means asking which pixels the drawing calls did not touch.

Suppose you copy the method and the cursor appears as a solid square instead of a hollow one with a see-through center. The result has diverged from what you expected. The source gives a diagnostic order for finding the step where it went wrong: check the image type, then the background alpha, then the drawing calls. Work through the stages in the order the data flows.