Make metapath DPI Awareness

[zufuliu]

No description provided.

[CzBiX]

Not a win32 developer, but can it be fixed by one line build configuration?

[zufuliu]

metapath currently use

<gdiScaling>true</gdiScaling>

https://docs.microsoft.com/en-us/windows/win32/sbscs/application-manifests#gdiscaling

Any way, Notepad2 and metapath don't have high-DPI image resources (except for metapath's toolbar, see issue #89).

[zufuliu]

A rough workflow (no time limit) to implement this and fix blur toolbar and file list on 4K monitor:

• @zufuliu: move metpath's toolbar images to different folder (as they are not reused by Notepad2), adjust reverent code and script. 9eb02b1
• @Matteo-Nigro: export toolbar SVG to different sized png and generate all toolbar bitmap images. 8d3d544
• @zufuliu: add NP2_ENABLE_HIDPI_TOOLBAR_IMAGE configuration option and update metapath.rc files. 973caff
• @zufuliu: (after v4.23.01 been released) port code (including auto scale toolbar) from Notepad2 to metapath to load toolbar image based on current DPI and use large icon in file list (issue Use large icon in encoding, scheme, MRU and favorites list on high DPI display #45). the change needs detail test. c7b580f
• test the final metapath.exe. @WanderMax (test blur toolbar and file list on 4K monitor), @elfsimulate (test toolbar disappear after move metapath to second monitor, issue toolbar disappeared in double screens #235).

[zufuliu]

@Matteo-Nigro you can make other sized toolbar bitmap in recent days, I'm planing to port DPI awareness code after Spring Festival (in February), thanks.

[Matteo-Nigro]

Ok, would we practically have to use the svg to create the various pngs in the right size? Would the dimensions be the same as we used for Notepad2?

[zufuliu]

Yes just use exiting svg in images/metapath folder (you could redesign them when feel it's better). dimensions are same with Notepad2 (currently only 16x16). make_all_metapath_toolbar_bitmap() is already for use.

[Matteo-Nigro]

Perhaps some of the icons could be taken from among the new ones in Notepad, just to give linearity in the style of the rest the existing ones might be fine already...

[zufuliu]

Yeah, give two app same icon style is good, metapath's current icon were built from Visual Studio 2017 Image Library in issue #89.

[zufuliu]

@Matteo-Nigro I'm sorry, just realized that Hi-DPI toolbar image is not required for porting DPI awareness code (that's how Notepad2 was developed in the past with the only 16px image), they are only needed for testing on 4K monitor after @WanderMax is back from Spring Festival (in February), so you can relax and make these images in recent weeks (or just in February as here still have enough time for v4.23.03).

Following are some incomplete suggestions if you are going to make same styled icon as Noteapd2 and use existing Notepad2's svg:

• Use better image name than current unchanged Visual Studio Image Library name, e.g. from toolbar tooltip string table:
  https://github.com/zufuliu/notepad2/blob/f7e5396cdcf8f3acda4ac64d035e5755c092923d/metapath/src/metapath.rc#L491-L506
• Place svg directly into images folder instead of images\metapath folder (it will be renamed to images\metapath_v1 after move out metapath.svg, and only used for backup v1 toolbar image made by @rmarquis in issue metapath icon are ugly #89). exported png also directly goes into images\16x16, images\24x24, etc. folders.
• Current make_metapath_toolbar_bitmap() will be renamed as make_metapath_v1_toolbar_bitmap() with images = f'images/metapath/{size}x{size}' changed into images = f'images/metapath_v1/{size}x{size}'. so you need to copy it as make_metapath_toolbar_bitmap() and change images = f'images/metapath/{size}x{size}' to images = f'images/{size}x{size}' (similar to make_notepad2_toolbar_bitmap(size)) and update image names in the array.
• Please at me, when you finished icon design, so I can do these renaming and code changes for you.

[Matteo-Nigro]

OK I'll start preparing the work and let you know when I'm ready. 😉

[Matteo-Nigro]

Hi @zufuliu , I was checking that among the icons in the various folders of both notepad2 and metapath there seem to be some that are not used... While I'm sorting out the files, should I delete them?

[zufuliu]

Please list used files you found, so we can discuss them.

[Matteo-Nigro]

For metapath are used all except these that do not appear in the toolbar:

• DeleteFilter.svg
• RestoreFromRecycleBin.svg

In Notepad2 I found these icons perhaps superfluous:

• OpenFolder_16x.svg and .png -> Replaced by Open.svg
• pin-angle.svg and pin-angle-16x.png-> Replaced by AlwaysOnTop.svg
• Prev2_16x.svg and .png -> Not used in the toolbar

[Matteo-Nigro]

In the meantime I redid all the icons even the ones maybe not needed.... Some being identical to those in Notepad2 I reused them keeping the filename used in Notepad2 so as not to have 2 files the same but named differently just to adhere to the metapath description. I have already exported the pngs in the various sizes as well, so I could potentially be ready for the next step..

[zufuliu]

all _16x.svg were taken (or modified from) from Visual Studio Image Libaray 2017 (including all metapaths' toolbar images).

DeleteFilter.svg is in use (see make_matapath_toolbar_bitmap()), RestoreFromRecycleBin.svg is indeed unused (just used to make RecycleBin.svg).

OpenFolder_16x.svg is used for generate res\OpenFolder.bmp (for both Notepad2 and metapath, e.g. on Notepad2's "Tools -> Run Command" or "File -> Launch -> Command" dialog), so the bmp needs regenerating and test on the dialog.

Prev2_16x.svg and Next2_16x.svg is used for res\Prev.bmp and res\Next.bmp (used on Customize Schemes dialog), you can make new svg (e.g. Prev.svg and Next.svg) to be used as replacement, so we can get ride of Visual Studio Image Libaray (to reduce one third party license, then no need to make metapath_v1 backups) after metapath's new toolbar images (and replacement svg, ) been committed (note: Bookmark_16x.svg and Bookmark2_16x.svg are unused).

I will add a commit to delete Bootstrap's pin-angle.svg, pin-angle-16x.png and the license text later.

[zufuliu]

OpenFolder_16x.svg, pin-angle.svg, Bookmark_16x.svg and Bookmark2_16x.svg (and their corresponding png) removed by 4da008c.

[Matteo-Nigro]

Hi @zufuliu , do you think I can reuse the back and forward icons of metapath also for Notepad2 or vice versa? On the other hand it is still 2 arrows only represented in a different style. This would allow us to delete 2 more files.

[zufuliu]

Resue is good, but please post a screenshot here to see result on Scheme Settings dialog. current Prev.bmp and Next.bmp are very small (they have color depth 4) and scale well on large scaling settings (you can change your monitor's scaling settings and compare the scaled result).

[Matteo-Nigro]

Certainly before any changes are made, I will update you with a comment here. I am sure I can achieve a good result while keeping the weight the same. As soon as I have a moment today I'll do the tests and post the screenshots.

[Matteo-Nigro]

Hi @zufuliu, I will probably upload the screenshots today...I got ahead of myself with other things as well. Only question, in the Customize schemes window (in Notepad2) it seems that the buttons can't accept bmp of size other than 16x9. I should have them take 16x16 instead.... I've tried changing the button size from the .rc file but the image still doesn't display... do you have any ideas?

[zufuliu]

Maybe other thing (likely the bmp it self) is wrong:

https://github.com/zufuliu/notepad2/blob/924eb78fa9ced17531e5a1dc372c909a9365945d/src/Styles.c#L4186-L4187

with MakeBitmapButton(hwnd, IDC_NEXTSTYLE, g_hInstance, IDB_OPEN_FOLDER);

You can just use the 32-bit bmp here and see if it works, then use MS Paint to save the png as 16-bit bitmap and try again.

[Matteo-Nigro]

I had saved the bmp at 4bit as you had done to limit the weight.. I'll try other colour depths.

[zufuliu]

@Matteo-Nigro seems it's my fail, it's bit depth 4 and 16 color bitmap.

save "Prev2_16x.png" and "Next2_16x.png" with MS Paint as 16 color bitmap should produce same bitmap as res\Prev.bmp and res\Prev.bmp.

[Matteo-Nigro]

Thanks @zufuliu! As promised here's the screenshot of the new metapath toolbar and how the buttons I mentioned before look like using the icons already present. If you like them I will continue with the work and give you the PR.

P.S. I would say that the python script should be ok too I had to modify it for the new paths and icon names.

[zufuliu]

@Matteo-Nigro Looks OK to me 👍
seems there still have some images from VS Image Library.

[Matteo-Nigro]

Yes some of the icons have been only slightly tweaked and they look pretty much like the originals.... If we want to totally get rid of the licenses I can try to change them a little bit to get away from the originals... What icons do you suggest to vary?

[Matteo-Nigro]

I was thinking in the meantime (since they practically mean the same thing) to merge the Launch and Run icons into one, this would not only reduce the number of icons but also change their appearance.

[zufuliu]

If redesign takes time, then we can just keep them (as it's free), current Prev.bmp and Next.bmp scales well than the thin arrows in your screenshot.

Run (on the Run dialog for both Notepad2 and metapath) is terminal (command prompt) + busy/wait cursor, if it's hard to made, use the triangle Run image is fine.

[Matteo-Nigro]

It wouldn't take too much time so much small changes can significantly change the icon making it for all intents and purposes different... For Prev.bmp and Next.bmp I can try making the lines thicker and see how they react to different sizes...

For the Run and Launch icon I put in my previous comment (which I later edited) a proposal of what a merger of the 2 icons might look like. Otherwise we can leave them as they are or if you have ideas I can design it....

Other than that since you were thinking of changing the folder tree regarding images, could you already do that in the branch develop? Otherwise if I do the PR there is a risk that there are redundancies or duplicate images (given the different paths)

[zufuliu]

OK, Launch image (already a terminal) can be used to replace the triangle Run (metapath's toolbar) and Run.ico in both.
Prev.bmp and Next.bmp can be kept as is (without change at the moment, as we still use VS Image).

following is current image folder structure in develop branch:

I think to make the PR minimum, images only used by metapath still put into images\metapath folder, images used by Notepad2 still put into images folder, unused images in images\metapath folder (both svg and png) can be deleted. make_metapath_toolbar_bitmap() need updated to take images from both images\nxn (for shared images) and images\metapath\nxn folders.

[Matteo-Nigro]

Well @zufuliu, I remain possibly available if there is anything to be fixed....:muscle:

[zufuliu]

@Matteo-Nigro Thank you, I'd say metapath's toolbar image resources is done. probable you can work on issue #585 (e.g. replace Run.ico with a small one made from 32x32\Launch.png, following is a 4KiB Run.ico!).

[zufuliu]

Loading toolbar image for current DPI and auto scale toolbar image implemented by c7b580f. It's still unknown whether file list icon blur is fixed or not (Notepad2's "Recent File", "Select Scheme" and "Customize Scheme" dialogs may have same problem on 4K monitor).

@Matteo-Nigro, @WanderMax, @elfsimulate please help test latest metapath built from develop branch when you have time, thanks.

[zufuliu]

Hi @WanderMax, is latest version (e.g. at https://github.com/zufuliu/notepad2/actions/runs/4043139548) of metapath works on your 4K monitor?

[WanderMax]

metapath main UI looks pretty good now, file list and toolbar is sharp and clean as below

icon in metapath options needs HD remastered

[zufuliu]

@WanderMax thank you 👍, old style icon on dialog is tracked in issue #585.

@elfsimulate can you take time to test latest metapath (e.g. from https://github.com/zufuliu/notepad2/actions/runs/4043139548) on two monitors (check whether toolbar is disappeared on moving between them)?

[zufuliu]

develop branch is merged into main, further development will be on main branch.