Scale the ImageIcon automatically to label size

Question

On my JFrame, I am using the following code to display an image on the Panel :

  ImageIcon img= new ImageIcon("res.png");
  jLabel.setIcon(img);

I would like to "auto-size" the picture in the label. Indeed, sometimes the image size is only few pixel, sometimes well more.

Is there a way to set the size of the label, and then to autosize the image in the label?

Answer 1

This is a tricky question. You highlight the fact that you are using a JLabel to show the image, which is the standard way of doing things, but, JLabel is a complex little beast, with text, icon and text alignment and positioning.

If you don't need all that extra functionality, I would simply create yourself a custom component capable of painting a scaled image...

The next question is, how do you want to scale the image? Do you want to maintain the aspect ratio of the image? Do you want to "fit" or "fill" the image to the available space.

@David is right. You should, where possible, avoid Image#getScaledInstance as it's not the fastest, but, more importantly, generally, it doesn't provide the highest quality either.

Fit vs Fill

The following example is rather simple (and borrows heavy from my library of code, so it's probably also a little convoluted ;)). It could use from a background scaling thread, but I would base the decision on the potential size of original image.

public class ResizableImage {

    public static void main(String[] args) {
        new ResizableImage();
    }

    public ResizableImage() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException ex) {
                } catch (InstantiationException ex) {
                } catch (IllegalAccessException ex) {
                } catch (UnsupportedLookAndFeelException ex) {
                }

                try {
                    BufferedImage image = ImageIO.read(new File("/path/to/your/image"));

                    JFrame frame = new JFrame("Test");
                    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                    frame.setLayout(new BorderLayout());
                    frame.add(new ScalablePane(image));
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                } catch (Exception exp) {
                    exp.printStackTrace();
                }
            }
        });
    }

    public class ScalablePane extends JPanel {

        private Image master;
        private boolean toFit;
        private Image scaled;

        public ScalablePane(Image master) {
            this(master, true);
        }

        public ScalablePane(Image master, boolean toFit) {
            this.master = master;
            setToFit(toFit);
        }

        @Override
        public Dimension getPreferredSize() {
            return master == null ? super.getPreferredSize() : new Dimension(master.getWidth(this), master.getHeight(this));
        }

        @Override
        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            Image toDraw = null;
            if (scaled != null) {
                toDraw = scaled;
            } else if (master != null) {
                toDraw = master;
            }

            if (toDraw != null) {
                int x = (getWidth() - toDraw.getWidth(this)) / 2;
                int y = (getHeight() - toDraw.getHeight(this)) / 2;
                g.drawImage(toDraw, x, y, this);
            }
        }

        @Override
        public void invalidate() {
            generateScaledInstance();
            super.invalidate();
        }

        public boolean isToFit() {
            return toFit;
        }

        public void setToFit(boolean value) {
            if (value != toFit) {
                toFit = value;
                invalidate();
            }
        }

        protected void generateScaledInstance() {
            scaled = null;
            if (isToFit()) {
                scaled = getScaledInstanceToFit(master, getSize());
            } else {
                scaled = getScaledInstanceToFill(master, getSize());
            }
        }

        protected BufferedImage toBufferedImage(Image master) {
            Dimension masterSize = new Dimension(master.getWidth(this), master.getHeight(this));
            BufferedImage image = createCompatibleImage(masterSize);
            Graphics2D g2d = image.createGraphics();
            g2d.drawImage(master, 0, 0, this);
            g2d.dispose();
            return image;
        }

        public Image getScaledInstanceToFit(Image master, Dimension size) {
            Dimension masterSize = new Dimension(master.getWidth(this), master.getHeight(this));
            return getScaledInstance(
                            toBufferedImage(master),
                            getScaleFactorToFit(masterSize, size),
                            RenderingHints.VALUE_INTERPOLATION_BILINEAR,
                            true);
        }

        public Image getScaledInstanceToFill(Image master, Dimension size) {
            Dimension masterSize = new Dimension(master.getWidth(this), master.getHeight(this));
            return getScaledInstance(
                            toBufferedImage(master),
                            getScaleFactorToFill(masterSize, size),
                            RenderingHints.VALUE_INTERPOLATION_BILINEAR,
                            true);
        }

        public Dimension getSizeToFit(Dimension original, Dimension toFit) {
            double factor = getScaleFactorToFit(original, toFit);
            Dimension size = new Dimension(original);
            size.width *= factor;
            size.height *= factor;
            return size;
        }

        public Dimension getSizeToFill(Dimension original, Dimension toFit) {
            double factor = getScaleFactorToFill(original, toFit);
            Dimension size = new Dimension(original);
            size.width *= factor;
            size.height *= factor;
            return size;
        }

        public double getScaleFactor(int iMasterSize, int iTargetSize) {
            return (double) iTargetSize / (double) iMasterSize;
        }

        public double getScaleFactorToFit(Dimension original, Dimension toFit) {
            double dScale = 1d;
            if (original != null && toFit != null) {
                double dScaleWidth = getScaleFactor(original.width, toFit.width);
                double dScaleHeight = getScaleFactor(original.height, toFit.height);
                dScale = Math.min(dScaleHeight, dScaleWidth);
            }
            return dScale;
        }

        public double getScaleFactorToFill(Dimension masterSize, Dimension targetSize) {
            double dScaleWidth = getScaleFactor(masterSize.width, targetSize.width);
            double dScaleHeight = getScaleFactor(masterSize.height, targetSize.height);

            return Math.max(dScaleHeight, dScaleWidth);
        }

        public BufferedImage createCompatibleImage(Dimension size) {
            return createCompatibleImage(size.width, size.height);
        }

        public BufferedImage createCompatibleImage(int width, int height) {
            GraphicsConfiguration gc = getGraphicsConfiguration();
            if (gc == null) {
                gc = GraphicsEnvironment.getLocalGraphicsEnvironment().getDefaultScreenDevice().getDefaultConfiguration();
            }

            BufferedImage image = gc.createCompatibleImage(width, height, Transparency.TRANSLUCENT);
            image.coerceData(true);
            return image;
        }

        protected BufferedImage getScaledInstance(BufferedImage img, double dScaleFactor, Object hint, boolean bHighQuality) {
            BufferedImage imgScale = img;
            int iImageWidth = (int) Math.round(img.getWidth() * dScaleFactor);
            int iImageHeight = (int) Math.round(img.getHeight() * dScaleFactor);

            if (dScaleFactor <= 1.0d) {
                imgScale = getScaledDownInstance(img, iImageWidth, iImageHeight, hint, bHighQuality);
            } else {
                imgScale = getScaledUpInstance(img, iImageWidth, iImageHeight, hint, bHighQuality);
            }

            return imgScale;
        }

        protected BufferedImage getScaledDownInstance(BufferedImage img,
                        int targetWidth,
                        int targetHeight,
                        Object hint,
                        boolean higherQuality) {

            int type = (img.getTransparency() == Transparency.OPAQUE)
                            ? BufferedImage.TYPE_INT_RGB : BufferedImage.TYPE_INT_ARGB;

            BufferedImage ret = (BufferedImage) img;

            if (targetHeight > 0 || targetWidth > 0) {
                int w, h;
                if (higherQuality) {
                    // Use multi-step technique: start with original size, then
                    // scale down in multiple passes with drawImage()
                    // until the target size is reached
                    w = img.getWidth();
                    h = img.getHeight();
                } else {
                    // Use one-step technique: scale directly from original
                    // size to target size with a single drawImage() call
                    w = targetWidth;
                    h = targetHeight;
                }

                do {
                    if (higherQuality && w > targetWidth) {
                        w /= 2;
                        if (w < targetWidth) {
                            w = targetWidth;
                        }
                    }
                    if (higherQuality && h > targetHeight) {
                        h /= 2;
                        if (h < targetHeight) {
                            h = targetHeight;
                        }
                    }

                    BufferedImage tmp = new BufferedImage(Math.max(w, 1), Math.max(h, 1), type);
                    Graphics2D g2 = tmp.createGraphics();
                    g2.setRenderingHint(RenderingHints.KEY_INTERPOLATION, hint);
                    g2.drawImage(ret, 0, 0, w, h, null);
                    g2.dispose();

                    ret = tmp;
                } while (w != targetWidth || h != targetHeight);
            } else {
                ret = new BufferedImage(1, 1, type);
            }

            return ret;
        }

        protected BufferedImage getScaledUpInstance(BufferedImage img,
                        int targetWidth,
                        int targetHeight,
                        Object hint,
                        boolean higherQuality) {

            int type = BufferedImage.TYPE_INT_ARGB;

            BufferedImage ret = (BufferedImage) img;
            int w, h;
            if (higherQuality) {
                // Use multi-step technique: start with original size, then
                // scale down in multiple passes with drawImage()
                // until the target size is reached
                w = img.getWidth();
                h = img.getHeight();
            } else {
                // Use one-step technique: scale directly from original
                // size to target size with a single drawImage() call
                w = targetWidth;
                h = targetHeight;
            }

            do {
                if (higherQuality && w < targetWidth) {
                    w *= 2;
                    if (w > targetWidth) {
                        w = targetWidth;
                    }
                }

                if (higherQuality && h < targetHeight) {
                    h *= 2;
                    if (h > targetHeight) {
                        h = targetHeight;
                    }
                }

                BufferedImage tmp = new BufferedImage(w, h, type);
                Graphics2D g2 = tmp.createGraphics();
                g2.setRenderingHint(RenderingHints.KEY_INTERPOLATION, hint);
                g2.drawImage(ret, 0, 0, w, h, null);
                g2.dispose();

                ret = tmp;
                tmp = null;
            } while (w != targetWidth || h != targetHeight);
            return ret;
        }
    }
}

Answer 2

Is there a way to set the size of the label

Override getPreferredSize() of JLabel and return the Dimensions you want, but because a JLabel will size itself to its content you will just need to resize the picture you add to the JLabel.

and then to autosize the image in the label?

You will have to resize your image according to the width and height you want (than simply add it to the JLabel and the JLabel will size to fit the image).

I do not recommend Image.getScaledInstance(..) have a read here for more:

• The Perils of Image.getScaledInstance() Mainly the problem outlined is:

Image.getScaledInstance() does not return a finished, scaled image. It leaves much of the scaling work for a later time when the image pixels are used.

Here is a custom method Ive been using to circumvent the issues created by getScaledInstance:

public static BufferedImage resize(BufferedImage image, int width, int height) {
    BufferedImage bi = new BufferedImage(width, height, BufferedImage.TRANSLUCENT);
    Graphics2D g2d = (Graphics2D) bi.createGraphics();
    g2d.addRenderingHints(new RenderingHints(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY));
    g2d.drawImage(image, 0, 0, width, height, null);
    g2d.dispose();
    return bi;
}

you would create an image to whatever size you want via:

BufferedImage image=ImageIO.read(..);
BufferedImage resizedImage=resize(image,100,100);//resize the image to 100x100

Answer 3

It can also be done by overriding the paintComponent method of JLabel and drawing the image having width and height as that of JLabel. And if you wish to resize the image when the parent container is resized you can apply the WindowListener on the parent container and repaint the Jlabel instance each time the parent container is resized. Here is the Demo:

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.ImageIcon;
import javax.swing.SwingUtilities;
import java.awt.Graphics;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;


public class  LabelDemo extends JFrame
{
    ImageIcon imageIcon;
    MyJLabel jLabel ;
    public LabelDemo ()
    {
        super("JLabel Demo");
    }
    public void createAndShowGUI()
    {
        imageIcon = new ImageIcon("apple.png");
        jLabel = new MyJLabel(imageIcon);
        getContentPane().add(jLabel);
        addWindowListener( new WindowAdapter()
        {
            public void windowResized(WindowEvent evt)
            {
                jLabel.repaint();
            }
        });
        setSize(300,100);
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setVisible(true);
        jLabel.repaint();
    }
    public static void main(String st[])
    {
        SwingUtilities.invokeLater( new Runnable()
        {
            @Override
            public void run()
            {
                LabelDemo demo = new LabelDemo();
                demo.createAndShowGUI();
            }
        });
    }
}
class MyJLabel extends JLabel
{
    ImageIcon imageIcon;
    public MyJLabel(ImageIcon icon)
    {
        super();
        this.imageIcon = icon;
    }
    @Override
    public void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        g.drawImage(imageIcon.getImage(),0,0,getWidth(),getHeight(),this);
    }
}