Image zoom

This is am image zoom program. In this program, you learn how to write Java code to display an image on the window, zoom the image in and out, and get the dimension of the computer screen.
The idea to zoom the image in and out is simple. You just increase or decrease the image size and at the same time move the coordinate (x,y) of drawing point. When you zoom the image in, you will increase the image size and move the coordinate to approach the top-left corner of the screen. When you zoom the image out, you will decrease the image size and move the coordinate to approach the bottom-right corner of the screen.

ImageZoom source code:

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;
import java.awt.image.*;

class Zoom extends Canvas implements ImageObserver{
    Image img;
    int iw;
    int ih;
int x;
int y;
int adjX=0;
int adjY=0;
int adjW=0;
int adjH=0;
Dimension ds;
Zoom(){
1 img=getToolkit().getImage("image03.jpg");
2 ds=getToolkit().getScreenSize();

}

public void paint(Graphics g){
3 Graphics2D g2d=(Graphics2D)g;
4 setImageBounds();
5 g2d.translate(x,y);
6 g2d.drawImage(img,0,0,iw,ih,this);


   }

7 public void setImageBounds(){

x=(int)ds.getWidth()/2-img.getWidth(this)/2+adjX;
y=(int)ds.getHeight()/2-img.getHeight(this)/2+adjY;
iw=img.getWidth(this)+adjW;
ih=img.getHeight(this)+adjH;

}

8 public void zoomIn(){
adjX-=10;
adjY-=10;
adjW+=20;
adjH+=20;
}

9 public void zoomOut(){
if(x<(int)ds.getWidth()/2-img.getWidth(this)/2){
adjX+=10;
adjY+=10;
adjW-=20;
adjH-=20;
}
}

}
10 class  MainInter extends JFrame implements ActionListener{

JButton btZoomIn;
JButton btZoomOut;
JPanel panel;
Zoom z;
MainInter(){
setTitle("Image zoom");
z=new Zoom();
btZoomIn=new JButton("+");
btZoomIn.addActionListener(this);
btZoomOut=new JButton("-");
btZoomOut.addActionListener(this);
btZoomOut.setOpaque(false);
add(z,BorderLayout.CENTER );
panel=new JPanel();
panel.setLayout(new FlowLayout());
panel.add(btZoomIn);
panel.add(btZoomOut);
add(panel, BorderLayout.SOUTH);
setDefaultCloseOperation(EXIT_ON_CLOSE);
setExtendedState(this.getExtendedState() | this.MAXIMIZED_BOTH);
setVisible(true);
}


11 public void actionPerformed(ActionEvent e){
if(e.getSource()==btZoomIn)
{
z.zoomIn();
z.repaint();
}
else if(e.getSource()==btZoomOut)
{
z.zoomOut();
z.repaint();
}
}


}

public class ImageZoom{
 
public static void main(String args[]){
      new MainInter();
 
}


}

Code Explanation:

1 Create an image object from the image03.jpg file. You may change the file name to your own image file. The image file has to be placed in the current project folder (where you ImageZoom.java exists).

2 Get the dimension (width and height) of the computer screen.

3 Convert the Graphics to Graphics2D. The Graphics2D allows you to move coordinate, rotate, or scale image object.

4 The setImageBounds method is invoked every time the image paints to set the coordinate of the image and its size. The x, y, iw, ih variables are changed when the zoom in button or zoom out button is clicked.

5 The translate(x,y) method is used to move the original coordinate (0,0) to the coordinate (x,y).

6 Display the image at the coordinate (0,0) in the new drawing area (after moving). The image width and height change according to iw and ih variables. The this argument refers to ImageObserver that is used to control the image loading.

7 The setImageBound method specifies the coordinate and size of the image. When the program firstly loads, we want the image to stay at the center of the computer screen so the x-axis (x) should be equal to the screen width subtracted by the image width (adjX=0). This idea is also applicable to the y-axis (y). The orginal image width and height are not changed at this time (adjW=0 and adjH=0). 

8 The zoomIn method is invoked when the zoom in button is clicked. The adjX and adjY variables are decreased by 10 so the image will move to the top-left corner gradually. The adjW and adjH variables increase by 20 so the image will be bigger.

9 In contrast, The zoomOut method works when the zoom out button is clicked. The adjX and adjY variables increase by 10 so the image will move to the bottom-right corner gradually. The adjW and adjH variables decreases by 20 so the image will be smaller.

10 The MainInter class is implemented to load the main interface of the image zoom program. In this program, the interface is divided in to two main areas. One (at the center) is for displaying the image so at the center the Zoom object z is placed in. Another one (at the bottom)  to display the zoom in and zoom out buttons. These buttons are grouped in the Jpanel.