Image Maps
Image maps are commonly used to create interactive Web pages. An image map is an image with hot areas that the user can click to accomplish a task, such as loading a different Web page into a browser. When the user positions the mouse pointer over a hot area, normally a descriptive message appears in the status area of the browser or in a tool tip.
Figure 21.4 loads an image containing several of the programming tip icons used in this book. The program allows the user to position the mouse pointer over an icon to display a descriptive message associated with it. Event handler mouseMoved (lines 3943) takes the mouse coordinates and passes them to method translateLocation (lines 5869). Method translateLocation tests the coordinates to determine the icon over which the mouse was positioned when the mouseMoved event occurredthe method then returns a message indicating what the icon represents. This message is displayed in the applet container's status bar using method showStatus of class Applet.
Figure 21.4. Image map.
(This item is displayed on pages 988 - 990 in the print version)
|
1 // Fig. 21.4: ImageMap.java 2 // Demonstrating an image map. 3 import java.awt.event.MouseAdapter; 4 import java.awt.event.MouseEvent; 5 import java.awt.event.MouseMotionAdapter; 6 import java.awt.Graphics; 7 import javax.swing.ImageIcon; 8 import javax.swing.JApplet; 9 10 public class ImageMap extends JApplet 11 { 12 private ImageIcon mapImage; 13 14 private static final String captions[] = { "Common Programming Error", 15 "Good Programming Practice", "Graphical User Interface Tip", 16 "Performance Tip", "Portability Tip", 17 "Software Engineering Observation", "Error-Prevention Tip" }; 18 19 // sets up mouse listeners 20 public void init() 21 { 22 addMouseListener( 23 24 new MouseAdapter() // anonymous inner class 25 { 26 // indicate when mouse pointer exits applet area 27 public void mouseExited( MouseEvent event ) 28 { 29 showStatus( "Pointer outside applet" ); 30 } // end method mouseExited 31 } // end anonymous inner class 32 ); // end call to addMouseListener 33 34 addMouseMotionListener( 35 36 new MouseMotionAdapter() // anonymous inner class 37 { 38 // determine icon over which mouse appears 39 public void mouseMoved( MouseEvent event ) 40 { 41 showStatus( translateLocation( 42 event.getX(), event.getY() ) ); 43 } // end method mouseMoved 44 } // end anonymous inner class 45 ); // end call to addMouseMotionListener 46 47 mapImage = new ImageIcon( "icons.png" ); // get image 48 } // end method init 49 50 // display mapImage 51 public void paint( Graphics g ) 52 { 53 super .paint( g ); 54 mapImage.paintIcon( this, g, 0, 0 ); 55 } // end method paint 56 57 // return tip caption based on mouse coordinates 58 public String translateLocation( int x, int y ) 59 { 60 // if coordinates outside image, return immediately 61 if ( x >= mapImage.getIconWidth() || y >= mapImage.getIconHeight() ) 62 return ""; 63 64 // determine icon number (0 - 6) 65 double iconWidth = ( double ) mapImage.getIconWidth() / 7.0; 66 int iconNumber = ( int )( ( double ) x / iconWidth ); 67 68 return captions[ iconNumber ]; // return appropriate icon caption 69 } // end method translateLocation 70 } // end class ImageMap
|
Clicking in the applet of Fig. 21.4 will not cause any action. In Chapter 24, Networking, we discuss the techniques required to load another Web page into a browser via URLs and the AppletContext interface. Using those techniques, this applet could associate each icon with a URL that the browser would display when the user clicks the icon.