Colors and Pixel Control in Java Graphics

Every picture you have ever seen on a screen, from a photograph to a button in a window, is ultimately made from one very small kind of unit. Before you can draw a line, fill a circle, or place a rectangle inside a window using Java, you need a clear picture of what that unit is and how the computer keeps track of where each unit sits. This article builds that picture in three parts: what a pixel is, how its position is named with coordinates, and how shapes are described in terms of those positions.

A very common first assumption is that a pixel is a fixed, universal piece of the screen, the same physical size no matter which monitor you are using. It is easy to see why. You are told that the screen is made of small squares, and it seems natural that every square is identical in size everywhere. The source describes a more careful picture, and this article will correct the assumption as we go.

Think of the screen as a grid. Each cell of the grid is one pixel, and each cell can show its own color. A drawing is nothing more than a particular arrangement of colors across that grid. A straight line, a filled circle, and a photograph all reduce to the same underlying operation: deciding what color each pixel should be.

This explains why drawing in Java depends on pixels. Drawing happens by changing the colors of individual pixels. The computer controls the color of each one, so to draw anything you must be able to name a particular pixel. Without a way to name pixels, the computer has no way to say which square should change. That naming system is the coordinate system described next.

Each pixel has a pair of integer coordinates, usually called x and y, which specify its horizontal and vertical position within the drawing area. Two rules fix how the numbering works. The x coordinate increases from left to right. The y coordinate increases from top to bottom. The origin, the point where both counts begin, is the upper left corner of the drawing area, written (0,0).

The vertical direction is the detail that most often surprises learners. In school graphs, the y value usually grows upward. In a pixel drawing area, y grows downward. The pixel at (0,1) therefore sits directly below the origin, not above it. Keep the picture of a grid that starts at the top left and extends right and down, and every coordinate will make sense.

The first correction to the common assumption is to separate two ideas that the word pixel can cover. A physical pixel is one of the small squares that actually make up the screen. A logical pixel is a unit of measure that is somewhere close to 1/100 inch. Both meanings appear in discussions of screens, and mixing them up is a frequent source of confusion.

On an ordinary screen, the source notes that there are usually about 100 pixels per inch. At that density the two units line up closely, so a logical pixel corresponds almost exactly to one physical square. Many screens now pack far more physical pixels into each inch, however. On these high-resolution screens, one physical pixel becomes much smaller than 1/100 inch.

The diagram above contrasts the two meanings. On a high-resolution screen, a drawing measured in logical pixels does not map to a single physical square. The physical squares are packed more tightly, so each logical unit covers several of them. What stays roughly constant for the programmer is the unit of measure itself, close to 1/100 inch. This is why the difference matters: a shape specified in logical units keeps its approximate size across screens, even though the number of physical squares behind it changes.

Once every pixel has a name, shapes can be described in pixel terms. The source uses the rectangle as its main example. A rectangle is specified by three things: the x and y coordinates of its upper left corner, and its width and height, all measured in pixels. The corner says where the rectangle begins, and the width and height say how far it extends.

Most errors in this topic come from three habits: reading y as if it grows upward, treating the origin as the center of the screen, and assuming one pixel is always one fixed physical size. The items below show each habit and the correction.