Swing JLabel icon: use same image for all resolutions

92 views Asked by At

I know they are quite a few forums that kinda talks about this, but my problem is that I have a JLabel with an icon which I do NOT want to scale when resolution is <> 100% ! I.e. (sorry, in french):

enter image description here

Initially, I set my JLabel icon with something like:

lblImage.setIcon( getNoteIcon() );

//...

ImageIcon getNoteIcon(){
    return new ImageIcon( getClass().getResource('path/to/file.png') );
}

This results are that my image displays blurry when HiDPI resolution is set to higher than 100%. Examples:

At 100%:

enter image description here

And at 150%:

enter image description here

You can see that the music note image is fuzzier in the 150% resolution.

What I want: I DO NOT want it to up or downscale the image! I want to keep the original size, unless I can provide different image sizes for various resolutions.

That being said, I looked and tried to use the BaseMultiResolutionImage class to deal with resolutions, passing along an array of the "same size image", but I get the same results when I change the resolution. This is the code I tried :

ImageIcon getNoteIcon(){
    List<Image> imgList = new ArrayList<Image>();

    /* all images are width = 108 height = 83 */
    imgList.add(ImageIO.read(new File('path/to/file.png'))); // 100%
    imgList.add(ImageIO.read(new File('path/to/file.png'))); // 125%
    imgList.add(ImageIO.read(new File('path/to/file.png'))); // 150%
    imgList.add(ImageIO.read(new File('path/to/file.png'))); // 175%
    imgList.add(ImageIO.read(new File('path/to/file.png'))); // 200%

    BaseMultiResolutionImage multiResolutionImage = new BaseMultiResolutionImage(imgList.toArray(new Image[0]));

    return new ImageIcon(
        multiResolutionImage
    );
}

I don't understand what I'm doing wrong, or if I'm even using BaseMultiResolutionImage correctly. Finally, if I do manage say to give 3 different images for 3 resolutions, (i.e. 100, 125, 150%), is there a way to tell it the "default" one to use when I do not have an image for a given resolution (i.e. 200%) ?

Can anyone shed a light on all of this? Seems like a lot of confusion on my end just to get an image to NOT scale in my window...

Much thanks! Pat


UPDATE AFTER "PROPER" USE OF BaseMultiResolutionImage:

try {
    List<Image> imgList = new ArrayList<Image>();

    imgList.add(ImageIO.read(getClass().getResource("images/notes/hidpi_100/file.png"))); // 100% - 108x83
    imgList.add(ImageIO.read(getClass().getResource("images/notes/hidpi_125/file.png"))); // 125% - 135x104
    imgList.add(ImageIO.read(getClass().getResource("images/notes/hidpi_150/file.png"))); // 150% - 162x124
    imgList.add(ImageIO.read(getClass().getResource("images/notes/hidpi_175/file.png"))); // 175% - 189x145
    imgList.add(ImageIO.read(getClass().getResource("images/notes/hidpi_200/file.png"))); // 200% - 216x166

    BaseMultiResolutionImage multiResolutionImage = new BaseMultiResolutionImage(imgList.toArray(new Image[0]));
    ImageIcon icon = new ImageIcon(multiResolutionImage);

    return icon;
}
catch(IOException ex){
    ex.printStackTrace();
    return null;
}

On screen font DPI set to 175% in Windows, this results in:

Before using BaseMultiResolutionImage

enter image description here

After using BaseMultiResolutionImage

enter image description here

Here is a comparison of what I get (left), with the actual image file it's supposed to show on the right hand side (mind you Paint doesn't take into account background transparency):

enter image description here

Any ideas as to why this "choppy" image is showing? What am I missing ?

Thanks again. Pat

0

There are 0 answers