## With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

No credit card required

Chapter 5, Windows, Dialogs, and Frames
|
185
HACK
Next, paint the white squares: one in the first row, two in the second, and
three in the third. Notice that the white squares are offset by one pixel
because the column and row variables (
firstRow
,
secondRow
, etc.) reference
the gray squares. These squares provide the 3D effect.
//first row
draw3dSquare(g, firstColumn+1, thirdRow+1);
//second row
draw3dSquare(g, secondColumn+1, secondRow+1);
draw3dSquare(g, secondColumn+1, thirdRow+1);
//third row
draw3dSquare(g, thirdColumn+1, firstRow+1);
draw3dSquare(g, thirdColumn+1, secondRow+1);
draw3dSquare(g, thirdColumn+1, thirdRow+1);
Finally, paint the gray squares on top of the white squares:
//first row
drawSquare(g, firstColumn, thirdRow);
//second row
drawSquare(g, secondColumn, secondRow);
drawSquare(g, secondColumn, thirdRow);
//third row
drawSquare(g, thirdColumn, firstRow);
drawSquare(g, thirdColumn, secondRow);
drawSquare(g, thirdColumn, thirdRow);
The Ofﬁce Icon
Figure 5-5 shows the MS Office corner icon in detail.
Figure 5-5. The Windows MS Office icon zoomed in
186
|
Chapter 5, Windows, Dialogs, and Frames
HACK
This icon is easier—it’s just a couple of straight lines. Also, it’s 13 × 13 pix-
els, which is bigger than the last icon. So, start with the trivial size methods:
private static final int WIDTH = 13;
private static final int HEIGHT = 13;
public int getIconHeight( ) {
return WIDTH;
}
public int getIconWidth( ) {
return HEIGHT;
}
The paintIcon( ) method is also pretty straightforward. Start by painting the
three white lines, and follow up with the dark gray lines. Here’s the code:
public void paintIcon(Component c, Graphics g, int x, int y) {
g.setColor(WHITE_LINE_COLOR);
g.drawLine(0,12, 12,0);
g.drawLine(5,12, 12,5);
g.drawLine(10,12, 12,10);
g.setColor(GRAY_LINE_COLOR);
g.drawLine(1,12, 12,1);
g.drawLine(2,12, 12,2);
g.drawLine(3,12, 12,3);
g.drawLine(6,12, 12,6);
g.drawLine(7,12, 12,7);
g.drawLine(8,12, 12,8);
g.drawLine(11,12, 12,11);
g.drawLine(12,12, 12,12);
}
Notice you don’t have to paint the light gray color because it’s actually the
panel background color. Any area you don’t explicitly paint over picks up
the background color, which is exactly what you want here.
These icons are approximations; some things will be different
between applications and systems. They were taken directly,
pixel by pixel, from Windows Explorer and Microsoft Office
2000 running on Windows XP Professional. Different applica-
tions are slightly different, even on the same version of Win-
dows. Double check platforms you are deploying to and make
sure the colors are correct. Meanwhile, it’s still a really good
working icon, even if a couple of pixels are off by a few shades.
—Jonathan Simon

## With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

No credit card required