Image Fundamentals: Creating, Loading, and Displaying

Image Fundamentals: Creating, Loading, and Displaying

There are three common operations that occur when you work with images: creating an image, loading an image, and displaying an image. In Java, the Image class is used to refer to images in memory and to images that must be loaded from external sources. Thus, Java provides ways for you to create a new image object and ways to load one. It also provides a means by which an image can be displayed. Let’s look at each.

Creating an Image Object

You might expect that you create a memory image using something like the following:

Image test = new Image(200, 100); // Error -- won’t work

Not so. Because images must eventually be painted on a window to be seen, the Image class doesn’t have enough information about its environment to create the proper data format for the screen. Therefore, the Component class in java.awt has a factory method called createImage( ) that is used to create Image objects. (Remember that all of the AWT components are subclasses of Component, so all support this method.)

The createImage( ) method has the following two forms:

Image createImage(ImageProducer imgProd) Image createImage(int width, int height)

The first form returns an image produced by imgProd, which is an object of a class that implements the ImageProducer interface. (We will look at image producers later.) The second form returns a blank (that is, empty) image that has the specified width and height. Here is an example:

Canvas c = new Canvas();

Image test = c.createImage(200, 100);

This creates an instance of Canvas and then calls the createImage( ) method to actually make an Image object. At this point, the image is blank. Later, you will see how to write data to it.

Loading an Image

The other way to obtain an image is to load one. One way to do this is to use the getImage( ) method defined by the Applet class. It has the following forms:

Image getImage(URL url)

Image getImage(URL url, String imageName)

The first version returns an Image object that encapsulates the image found at the location specified by url. The second version returns an Image object that encapsulates the image found at the location specified by url and having the name specified by imageName.

Displaying an Image

Once you have an image, you can display it by using drawImage( ), which is a member of the Graphics class. It has several forms. The one we will be using is shown here:

boolean drawImage(Image imgObj, int left, int top, ImageObserver imgOb)

This displays the image passed in imgObj with its upper-left corner specified by left and top. imgOb is a reference to a class that implements the ImageObserver interface. This interface is implemented by all AWT (and Swing) components. An image observer is an object that can monitor an image while it loads. ImageObserver is described in the next section.

With getImage( ) and drawImage( ), it is actually quite easy to load and display an image. Here is a sample applet that loads and displays a single image. The file Lilies.jpg is loaded, but you can substitute any GIF, JPG, or PNG file you like (just make sure it is available in the same directory with the HTML file that contains the applet).

/*

    <applet code="SimpleImageLoad" width=400 height=345>

     <param name="img" value="Lilies.jpg">

    </applet>

*/

import java.awt.*; import java.applet.*;

public class SimpleImageLoad extends Applet

{

Image img;

public void init() {

img = getImage(getDocumentBase(), getParameter("img"));

}

public void paint(Graphics g) { g.drawImage(img, 0, 0, this);

}

}

In the init( ) method, the img variable is assigned to the image returned by getImage( ). The getImage( ) method uses the string returned by getParameter("img") as the filename for the image. This image is loaded from a URL that is relative to the result of getDocumentBase( ), which is the URL of the HTML page this applet tag was in. The filename returned by getParameter("img") comes from the applet tag <param name= "img" value="Lilies.jpg">. This is the equivalent, if a little slower, of using the HTML tag <img src="Lilies.jpg" width=400 height=345>. Figure 27-1 shows what it looks like when you run the program.

When this applet runs, it starts loading img in the init( ) method. Onscreen you can see the image as it loads from the network, because Applet’s implementation of the ImageObserver interface calls paint( ) every time more image data arrives.

Figure 27-1   Sample output from SimpleImageLoad

Seeing the image load is somewhat informative, but it might be better if you use the time it takes to load the image to do other things in parallel. That way, the fully formed image can simply appear on the screen in an instant, once it is fully loaded. You can use ImageObserver, described next, to monitor loading an image while you paint the screen with other information.