# Force the graphic to load in @2x mode

**URL:** <https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650>\
**Category:** Windows\
**Created:** [20 June 2022 10:07 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650 "2022-06-20T10:07:59Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Yomy](https://avatars.discourse-cdn.com/v4/letter/y/ea5d25/32.png) [@Yomy](https://iplug2.discourse.group/u/Yomy)\
**Post date:** [20 June 2022 10:07 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650/1 "2022-06-20T10:07:59Z")

</div>

Hi everybody,

How can I force my plugin to load the @2x graphics? It doesn’t look sharp enough when resized with the regular size images.

Any light on the issue will be appreciated.

---

<div class="post-metadata">

**Author:** ![RexMartin2](https://avatars.discourse-cdn.com/v4/letter/r/da6949/32.png) [@RexMartin2](https://iplug2.discourse.group/u/RexMartin2)\
**Post date:** [22 June 2022 16:36 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650/2 "2022-06-22T16:36:23Z")

</div>

The “sharpness” of the image depends on the video monitor resolution (ppi). High resolution monitors will load the @2x images (if available). Standard definition monitors will load the 1x images.

If you somehow “force” load the @2x graphics when the system doesn’t call for it the image will be drawn 2x _larger_, not sharper.

Now, that said, I have found a couple of tricks in iPlug2:

1. IME, NanoVG draws sharper bitmap images than SKIA - especially when resized \>1
2. I load **only** @2x pngs in my projects which forces the system to downsample for standard definition monitors. This seems to make the images sharper when resized upward on standard def monitors (because we’re resizing up toward it’s source size rather than bigger than source size). This “trick” doesn’t help on high def monitors where @2x, I believe, at least for now, is the best we can do.

For the sharpest images on all monitors use Vector graphics wherever possible.

---

<div class="post-metadata">

**Author:** ![Yomy](https://avatars.discourse-cdn.com/v4/letter/y/ea5d25/32.png) [@Yomy](https://iplug2.discourse.group/u/Yomy)\
**Post date:** [23 June 2022 11:12 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650/3 "2022-06-23T11:12:29Z")

</div>

Thanks for your answer.

How do you load the @x2 only?

in config.h  
#define PNGBACKGROUND\_FN “bg.png” //Just coment out this line?  
#define PNGBACKGROUND\_2X\_FN “bg@2x.png”

in main.rc  
PNGBACKGROUND\_FN PNG PNGBACKGROUND\_FN //Remove this line?  
PNGBACKGROUND\_2X\_FN PNG PNGBACKGROUND\_2X\_FN

in MyPlug.cpp  
const IBitmap backgroundBitmap = pGraphics-\>LoadBitmap(PNGBACKGROUND\_FN); //Should I change that to PNGBACKGROUND\_2X\_FN?

Thanks again.

---

<div class="post-metadata">

**Author:** ![RexMartin2](https://avatars.discourse-cdn.com/v4/letter/r/da6949/32.png) [@RexMartin2](https://iplug2.discourse.group/u/RexMartin2)\
**Post date:** [23 June 2022 14:14 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650/4 "2022-06-23T14:14:06Z")

</div>

The magic combination - that seems to work properly in all formats (VST, VST3, AAX and AU) on both Mac and PC - is:

1. in config.h - list BOTH the 1x and 2x file names  
#define PNGBACKGROUND\_FN “bg.png”  
#define PNGBACKGROUND\_2X\_FN “bg@2x.png”

2. in main.rc - list ONLY the 2x file names  
PNGBACKGROUND\_2X\_FN PNG PNGBACKGROUND\_2X\_FN

3. in MyPlug.cpp - use the 1x resource name  
`const IBitmap backgroundBitmap = pGraphics->LoadBitmap(PNGBACKGROUND_FN);`

4. place ONLY the @2x.png files in the project “resources/img” folder

5. use the 1x size when setting PLUG\_WIDTH and PLUG\_HEIGHT in config.h and all control x/y locations in mLayoutFunc.

This approach forces the plugin to load the @2x files for every situation. The advantage is that 1) we only need to create 1 set of bitmap files (the 2x ones) and 2) bitmaps render somewhat sharper on standard def monitors.

I design all my plugin backgrounds and IBitmap controls at 2x size and then simply export a 50% version to find the 1x coordinates for the controls, PLUG\_HEIGHT/WIDTH, etc.

This is working for me everywhere I have tested it but if anyone knows of any potential issues please advise.

---

<div class="post-metadata">

**Author:** ![Yomy](https://avatars.discourse-cdn.com/v4/letter/y/ea5d25/32.png) [@Yomy](https://iplug2.discourse.group/u/Yomy)\
**Post date:** [24 June 2022 14:44 UTC](https://iplug2.discourse.group/t/force-the-graphic-to-load-in-2x-mode/650/5 "2022-06-24T14:44:10Z")

</div>

Thank you for for all the info, that’s exactly what I was looking for. Works great.
