How to display image in a panel with JFileChooser

[srisar]

hay all, please help me with this project. im trying to to a basic image viewer.
here is what i need.
1] there is a button, when i click it will open file open dialog box and i can select an image file,
2] a JPanel will show that image,
3] when i click the open button again same process will continue.

here is my code

package level03;

import javax.swing.*;
import javax.imageio.*;
import java.awt.*;
import java.awt.event.*;
import java.io.*;

public class ImageShow extends JPanel {

    private String path;
    private Image img;
    public int width, height;

    public ImageShow(String path) throws IOException {

        this.path = path;
        img = ImageIO.read(new File(path));

        width = img.getWidth(this);
        height = img.getHeight(this) + 38;
    }

    @Override
    public void paint(Graphics g) {
        if (img != null) {
            g.drawImage(img, 0, 0, this);
        }
    }
}

class ImageFrame {

    public static void main(String[] args) throws IOException {

        ImageFrame frm = new ImageFrame();
        frm.callAll();

    }
    JFrame f;
    JButton btn;
    ImageShow panel;

    public void callAll() throws IOException {
        f = new JFrame("Image Load");
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        btn = new JButton("Open");
        btn.addActionListener(new ActionListener() {

            public void actionPerformed(ActionEvent e) {

                JFileChooser fc = new JFileChooser("d:\\");
                fc.showOpenDialog(f);

                try {
                    panel = new ImageShow(fc.getSelectedFile().getPath());
                } catch (IOException ex) {
                    System.out.println("Error");
                }

                f.add(panel, BorderLayout.CENTER);
                f.setLocation(300, 300);
                f.setSize(panel.width, panel.height);

            }
        });

        f.add(btn, BorderLayout.NORTH);
        f.setLocation(300, 300);
        f.pack();
        f.setVisible(true);


    }
}

the problem is when i select another image, the previous image too showing

please help me
thanks in advance

[Fubarable]

the problem is when i select another image, the previous image too showing

The problem is here:

    public void paint(Graphics g) {
        if (img != null) {
            g.drawImage(img, 0, 0, this);
        }
    }

You need to call super.paint(g) as the first call of this method so that the JPanel will erase its previous background:

    public void paint(Graphics g) {
        super.paint(g);
        if (img != null) {
            g.drawImage(img, 0, 0, this);
        }
    }

But having said that, I also need to tell you that you should not be using the paint method here at all since you're not changing how the jpanel paints its children or borders, but instead should be overriding paintComponent (and then call super.paintComponent(g) in an equivalent way.

Much luck and HTH.

[srisar]

thanks for reply, i tried super call but still the same, and as you said about paintcomponet, i tried that too, still the same, old image is still showing, do u have any more idea. thanks

[Fubarable]

thanks for reply, i tried super call but still the same, and as you said about paintcomponet, i tried that too, still the same, old image is still showing, do u have any more idea. thanks

So you're saying in effect is that you've tried my suggestion, that it doesn't work, but that you won't show the code of this try for some reason, not allowing us to know what you're now doing wrong? No, without more code, I've no more suggestions.

[srisar]

im sorry i didn't meant to do that, i did exactly what you said and got the same output

here is my code

package level03;

import javax.swing.*;
import javax.imageio.*;
import java.awt.*;
import java.awt.event.*;
import java.io.*;

public class ImageShow extends JPanel {

    private String path;
    private Image img;
    public int width, height;

    public ImageShow(String path) throws IOException {

        this.path = path;
        img = ImageIO.read(new File(path));

        width = img.getWidth(this);
        height = img.getHeight(this) + 38;
    }

//    @Override
//    public void paint(Graphics g) {
//        super.paint(g);
//        if (img != null) {
//            g.drawImage(img, 0, 0, this);
//        }
//    }

    @Override
    public void paintComponent(Graphics g){
        super.paintComponent(g);
        if (img != null) {
            g.drawImage(img, 0, 0, this);
        }
    }
}

class ImageFrame {

    public static void main(String[] args) throws IOException {

        ImageFrame frm = new ImageFrame();
        frm.callAll();

    }
    JFrame f;
    JButton btn;
    ImageShow panel;

    public void callAll() throws IOException {
        f = new JFrame("Image Load");
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        btn = new JButton("Open");
        btn.addActionListener(new ActionListener() {

            public void actionPerformed(ActionEvent e) {

                JFileChooser fc = new JFileChooser("d:\\");
                fc.showOpenDialog(f);

                try {
                    panel = new ImageShow(fc.getSelectedFile().getPath());
                } catch (IOException ex) {
                    System.out.println("Error");
                }

                f.add(panel, BorderLayout.CENTER);
                f.setLocation(300, 300);
                f.setSize(panel.width, panel.height);

            }
        });

        f.add(btn, BorderLayout.NORTH);
        f.setLocation(300, 300);
        f.pack();
        f.setVisible(true);


    }
}

[Fubarable]

If you want to have one JPanel that can display different images, you need to give this JPanel a public method, say setImage(Image ....) that allows you to change the image that it holds. The app should add this JPanel into the JFrame and leave it be. Then the actionListener for the button to change images should not try to create a new JPanel, but rather should take the existing JPanel (ImageShow) and call setImage on the existing ImagePanel and then call repaint.

[srisar]

thanks, your post helps me a lot, i m modifying the code right now as you said, when i finish i will let you know. thanks for u to gave your time to assist me... it is a great help thanks again

[Fubarable]

No problem. You may wish also to set the JPanel's preferredSize from within the setImage method by using the width and height variable. Then call pack on the JFrame after changing the JPanel's image. And then consider calling setLocationRelativeTo(null) on the JFrame after packing it, to center things. Just suggestions that you can take or leave. Again, much luck.

[srisar]

hay i came up with like this

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

public class ImagePanel extends JPanel {

    Image img;

    @Override
    public void paintComponent(Graphics g) {
        g.drawImage(img, 0, 0, null);
    }

    public void setImage(Image img) {
        this.img = img;

        Dimension size = new Dimension(img.getWidth(null), img.getHeight(null));
        this.setSize(size);
        this.setPreferredSize(size);
        this.setMinimumSize(size);
        this.setMaximumSize(size);
        this.setLayout(null);

        this.repaint();
    }
}

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

public class ImageShow {

    static ImagePanel panel;

    public static void main(String[] args) {

        panel = new ImagePanel();
        panel.setImage(new ImageIcon("D:\\boat.jpg").getImage());

        JFrame frame = new JFrame();

        JButton btn = new JButton("open");
        btn.addActionListener(new ActionListener() {

            public void actionPerformed(ActionEvent e) {
                panel.setImage(new ImageIcon("D:\\top.jpg").getImage());
            }
        });

        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().add(btn, BorderLayout.NORTH);
        frame.getContentPane().add(panel, BorderLayout.CENTER);
        frame.pack();
        frame.setVisible(true);

    }


}

i couldn't figure out whats wrong please can you check

[Fubarable]

hay i came up with like this
i couldn't figure out whats wrong please can you check

Um.... could you kindly tell us the symptoms? It's like going to the doctor and saying "I'm sick, fix me" without telling him what's wrong. No doctor is that smart, and neither are we.

[srisar]

as you can see when i click the button i expect it to show the top.jpg image but it doesnt show anything, means it hides the previous image(at last), but not showing new image

[srisar]

oops im sorry it actually worked, my small mistake(no change in code, image file name is wrong), but can u tell me how can i automatically reside the window to the new image size

[Fubarable]

oops im sorry it actually worked, my small mistake(no change in code, image file name is wrong), but can u tell me how can i automatically reside the window to the new image size

That has already been answered above in my pack suggestion in reply #8.

[srisar]

yes i got it, you finally made me work. thanks a lot, it is a great help im very glad. thanks a lot

[Fubarable]

Cool and congrats!