Part III: Creating Browser Graphics in Visual Studio .NET

Generator QR-Code in Visual Studio .NET Part III: Creating Browser Graphics

Icons may be different in many ways from the other graphics you use with your browsers, but they still have a set of attributes of which you must be aware Although there are many types of icons, the ones you can add to your browser s title bar and status bar have the following requirements: Width of 16 pixels Height of 16 pixels 256 colors (8-bit color)

One way icons differ from other types of graphics is that you can have more than one icon in a single icon file When you first load IconEdit32, it ll be set up to create a 256-color, 32 x 32 icon, as you can tell by the asterisk next to that icon type on the right side of the editor s window You want to create a 256-color, 16 x 16 icon, so you need to click the correct icon type in the editor s window When you do, an asterisk appears next to the icon type The asterisk next to the 32 x 32 icon, however, doesn t go away, telling you that your icon file now contains both 32 x 32 and 16 x 16 icons To get rid of the 32 x 32 icon, right-click its asterisk and choose the Delete 32 x 32 256 Color Image command from the menu that appears, as shown in Figure 16-2 The icon disappears

IconEdit32 contains all the tools you need to create your custom icons Suppose, for example, that you want to make a smiley-face icon Here s how: 1 Start a new 16 x 16, 256-color icon (See the preceding section if you re not sure how to do so) The icon editor displays a 16 x 16 grid in its work area, as shown in Figure 16-3 2 Select the Hollow Ellipse tool, which is the ninth tool down on the left side of the editor s window This tool enables you to draw the outlines of circles and ellipses 3 In the color boxes at the bottom of the editor s window, choose the color black The selected color appears in the foreground color indicator in the lower-left corner of the window

4 Place the mouse cursor in the center of the work-area grid, hold down the left mouse button, and drag the mouse until you ve produced a circle that just fits in the work area Figure 16-4 shows the new circle in the icon grid

5 Select the Fill tool, which is the fifth tool down (the one that looks like a tipped paint bucket) on the left side of the editor s window 6 Select a shade of yellow from the color boxes at the bottom of the window The foreground color indicator turns yellow 7 Place the mouse cursor inside the hollow circle and click The editor fills the circle with yellow (see Figure 16-5)

8 Select the Pen tool, which is the first tool on the left side of the editor s window You use this tool to draw in the icon s work area 9 Select the color green from the color selector 10 Click in the appropriate grid locations to create the eyes, nose, and mouth, as shown in Figure 16-6 Each time you click, the editor fills the clicked box with the color green 11 Choose File Save

Even though icons are a special graphical format, there s no reason you can t use graphics in other formats to create your icon If, for example, you have a 16 x 16 bitmap that you want to use as an icon, IconEdit32 can do the conversion for you Perform the following steps to see how this works: 1 Start a new 16 x 16, 256-color icon (Refer to the section Starting a New Icon if you need detailed instructions) The icon editor displays a 16 x 16 grid in its work area 2 Load the 16 x 16 source image (the image you want to use as an icon) into a paint program, such as Paint Shop Pro (see Figure 16-7) 3 Choose Selections Select All to select the entire image You can also use the Ctrl+A keystroke 4 Choose Edit Copy to copy the image to the Clipboard You can also use the Ctrl+C keystroke 5 Switch to IconEdit32 and choose Edit Paste, or just press Ctrl+V The 16 x 16 image appears in IconEdit32 s work area, as shown in Figure 16-8 6 In IconEdit32, choose File Save to save the new icon under an appropriate name