SDSU CS 596 Java Programming
Fall Semester, 1998
Scaling an Image
To Applet Index
San Diego State University -- This page last updated 03-Jan-99
Description

This applet allows the user to change the size of an image. Use the scrollbar to change the size of the image. The ImageCanvas class uses the drawImage method of the Graphics class to scale the image. Notice how the image flickers when you resize the image. This occurs when the canvas first clears the drawing area, then draws the image. On the next example the flicker addressed by not clearing the drawing area before redrawing the image.

The scrollbar value ranges from from 10 to 200. These values represent the percentage used to scale the image. A value of 200 displays an image twice the size of the orginal image.

Applet

Your browser does not support Java applets, so you can not see this applet operate.

Applet Tag

<DIV ALIGN="center">
   <APPLET 
      ARCHIVE="AppletClasses.jar" 
      CODE="ImageScaleFlickerApplet.class" 
      WIDTH=350 HEIGHT=330>
      Your browser does not support Java applets, so
      you can not see this applet operate.
   </APPLET>
</DIV>

Applet Source Code

ImageCanvas.java

import java.awt.*;
import java.awt.image.ImageObserver;

public class ImageCanvas extends Canvas
  {
  Image displayImage;
  int imageWidth;
  int imageHeight;
  int displayWidth;
  int displayHeight;
    
  public ImageCanvas( Image toDisplay )
    {
    displayImage = toDisplay;
    imageWidth = displayImage.getWidth( this );
    imageHeight = displayImage.getHeight( this );
    displayWidth = imageWidth;
    displayHeight = imageHeight;
    }
  
  public void paint( Graphics display) 
    {
    //center image
    int startX = (imageWidth - displayWidth) / 2;
    int startY = (imageHeight - displayHeight) / 2;

    //drawImage scales image to fit displayWidth, height 
    display.drawImage( displayImage, startX, startX, 
                  displayWidth, displayHeight,
                  this );
    }

  // Scale display image
  public void scaleImage( int percentScale)
    {
    displayWidth = (imageWidth * percentScale) / 100;
    displayHeight =   (imageHeight * percentScale) / 100;
    repaint();
    }
  }

ImageScaleFlickerApplet.java

import java.awt.*;
import java.applet.Applet;
import java.awt.Image;
import java.awt.image.ImageObserver;
import java.awt.event.AdjustmentListener;
import java.awt.event.AdjustmentEvent;

public class ImageScaleFlickerApplet extends Applet
  {
  private Scrollbar imageChanger = 
      new Scrollbar( Scrollbar.HORIZONTAL, 
                  100, //Initial value
                  1,   //Not used, area visiable
                  10,   // min value, seems to be block change rate
                  201 ); //max value, 1 compensates for visisble area
                      // subtracted from max value.
  
  private ImageCanvas tigerCanvas;
    
  public void init() 
    {
    Image tiger = getImage( "../images/tiger.gif" );
    tigerCanvas = new ImageCanvas( tiger);
    
    imageChanger.addAdjustmentListener( new ImageAdjustment() );
    setLayout( new BorderLayout() );
    add( BorderLayout.NORTH, imageChanger );
    add( BorderLayout.CENTER, tigerCanvas ); 
    }  
  
  private Image getImage( String imageName)
    {
    Image loadedImage = null;
    try 
      {      
      loadedImage = super.getImage( getCodeBase(), imageName );
      
      //Insure image is downloaded before showing it
      MediaTracker tracker = new MediaTracker( this );
      tracker.addImage( loadedImage, 0 );
      tracker.waitForID( 0 );
      }
    catch (InterruptedException netProblem ) 
      {
      System.out.println( "error");
      }
    return loadedImage;
    }
  
  class ImageAdjustment implements AdjustmentListener 
    {
    public void adjustmentValueChanged( AdjustmentEvent event )
      {
      // Use the value of the scrollbar as the scale rate of image
      tigerCanvas.scaleImage( event.getValue());
      }
    }              
  }

Visitors since 03-Jan-99