Arduino IDE on High DPI (take 2)

[cmaglie]

This is a follow up on @PaulStoffregen's PR #2532(edit: wrong number) PR #2776

• Rebased Arduino IDE on High DPI  #2532 Add scaling for themed fonts and graphics (hires displays) #2776 on current master
• Added some hi-res images for the toolbar
• Factored out the formula to scale up dimensions

TODO / questions:

• The font of the menus and the textarea are not scaled as the rest of the GUI. Is this because the OS scales them automatically? Otherwise we should scale them as well.
• Add a "Scale interface for UHD displays" preference in the preferences dialog.
• The gui.scalePercent is now a theme preference (in theme.txt) but I'm wondering if this should really be a general preference (in preferences.txt) because screen scaling doesn't seems related to the theme

[PaulStoffregen]

The setting in theme.txt was a simple hack meant to eventually be replaced by a proper preference or automatic detection of the screen DPI from the operating system.

[elFallino]

Font size is scaled by the operating systems decoration manager / window manager while everything else is hardcoded info the IDE.
Some things this patch is scaling could be done better by using proper Java Layout Managers (at the moment, mostly the null layout manager with fixed values for Position and size is used) , others need to be scaled (like all the bitmaps). But doing this would mean to completely rewrite the GUI.

Automatical detection of screen resolution would be nice, but there is no common way to do so for all kinds of operating systems and window managers.

A good way could be a scaling option in preferences (e.g. a slider or drowdown in 25% steps Form 75% up to 400% or so).
Scaling the bitmaps is an issue, too. If they are scaled up to 400% or worst: scaled using an odd factor like 275%, they look pretty ugly. Pauls idea for that was to switch to high res bitmaps if scaling factor exceeds, lets say, 200% (rendering vector graphics would be an alternative).

[lmihalkovic]

The path i chose for the toolbar bitmaps was to replace them with java code generated from SVGs using a tool somewhere on github (described in #4196)

[lmihalkovic]

Each platform has a way to find out their scaling ratio, and the codebase already has the Platform class to abstract this kind of underlying API differences.

[cmaglie]

This last version includes:

• a new preference for setting scale that ranges from 100% to 200% (less than 100% is useless more than 200% is huuuge IMHO I see that most apps that allows interface scaling have the same range)
• now the resource images are vectorial SVG
• there is an "Autodetect" checkbox, this is a placeholder for an eventual future DPI-detection subroutine, for now it defaults to 100%.

Testing welcome!

/cc @00alis

[lmihalkovic]

You know that now that you converted the res to SVGs it is easy to generate java code for Icon subclasses?! Then you can cleanup the toolbar code (dont have to but it would help with making a Tool2 interface that would allow button contributions for eg) and eliminate batik (using it scale a handful of svgs is IMHO like moving the piano instead of getting the stool closer to the piano)

[elFallino]

Imagine a 15 Inc 4k (UHD) screen and 200% isn't huge. So please add some more scaling factors >200%.
There are already 5K displays and those high DPI displays will enter the consumer sector more and more.
Do not build-in unneccessary restrictions that will come up soon. ;)

[wishAI]

Unfortunally,it doesn't work on my surface pro 4 no matter how I change the "gui.scale" in the preferences.txt . Also , the links of the old versions doesn't work and I can't test it.

[cmaglie]

no matter how I change the "gui.scale" in the preferences.txt

uhm, that's really weird, have you tried to change the value from the preference panel instead of changing preference.txt?

[cmaglie]

[elFallino]

It is working for me, using preferences window (Windows 10).

[wishAI]

I change it in the panel and it works , thank you.

[choidamdam]

@cmaglie

more than 200% is huuuge

I'm using Dell Inspiron 15 7548 laptop and recommended display scaling (the default one) is 250% on Windows 10. Maximum scaling is 350% on my display settings.

[cmaglie]

Updated the scale range up to 400%

[jem-green]

Icon scaling works as expected while dragging the application across multiple monitors in windows 10

[jem-green]

Ok next is message windows being too small to read !

[jem-green]

even smaller !

[jem-green]

Double splash window at start-up is this normal?

[jem-green]

And possibly finally can we scale the window size along with the preferences ?

[cmaglie]

@jem-green thanks very much for the feedback, I'll try to address these issues!

[bonnee]

The tab bar reaches 3000px and doesn't scale higher

[cmaglie]

@Sembazuru
yes, the print function needs a bit of overhaul. The issue you reported AFAIU is old and not caused by this pull-request (even if the hi-dpi patch make it worse). I see that you already opened another issue, let's continue the discussion there.

[Sembazuru]

Ok. Sounds good. I just downloaded the most recent nightly (dated 2016-02-19T05:41) and the merge seems stable so far.

[jordansissel]

Success! I am using Arduino 1.6.8 and can confirm that the interface scaling preference works well for me (Windows 10)

Thank you! ❤️

[lorenzoromagnoli]

@cmaglie I can see that you added the 2x sized image,
but it doesn't seem to be used and the splash screen still looks bad on my macbook retina display.
328d3b6

[tobsen]

Same here on a iMac retina, I also tried the nightly.

[andypiper]

What's the current story with the splash screen, toolbar icons, and the text in editor tab titles on OS X? Everything else looks nice and smooth, but those items seem to be scaled from low-res? (1.6.9)

[edgimar]

I'm using version 1.6.12 of the IDE under Ubuntu 16.04 and Java 1.8.0_101. When the interface scale is set to 200%, the editor window and tab (and status window) are properly sized on my display, however, the settings window, menus, and several other dialogs are still not scaled (text is very tiny).

[avastmick]

Windows 10 Dell XPS 15 9550 3840x2160 resolution.

Generally the UI is fine and scales okay, but only once I set the scaling to 300% so the font size is easily readable. The pop-up screens are mangled and unusable, however. The window is not resizable and not all the items are rendered / or are heavily overlapped.

Any ideas on how to be able to see pop-up screen like this?

[bbulkow]

Using 1.8.8 from the windows store.

Usable but not great.

The menu items aren't scaled.

The scaling set in the Window 10 UI isn't obeyed. All my other programs look at the scale factor I have set for that monitor, so when I drag a window from monitor to monitor, it rescales according to the scale factor of that monitor.

[tobia]

Does anybody have any workaround for telling Java how much to scale the default AWT elements, or whether to scale them at all?

I'm on a 125% HiDPI monitor. I have set X11's resource correctly to Xft.dpi: 120 (96 × 1.25) but Arduino (or Java) seem to detect a 200% HiDPI setting from who knows where. I fixed the main interface using the "Interface Scale" preference, but I cannot find a way to scale the menus.

Is there an environment variable, Java property, or any other hack to force the AWT scaling factor, or even to disable it at all? Given the choice, I would prefer my menus to be 20% smaller, rather than 60% bigger.

I tried both sun.java2d.uiScale and GDK_SCALE, as mentioned in Arch Linux Wiki, to no avail.

Related to #6472

[s-light]

found a workaround posted in #9170
basically create a custom .gtkrc-2.0 file with font size you like and start arduino with this file:
GTK2_RC_FILES=my_arduino_gtkrc-2.0.conf arduino

[Feromrk]

the workaround from @s-light didn't work for me (manjaro linux with kde). The menu bars still stayed ultra small.
Changing GDK_SCALE as @tobia suggested worked! Note that it accepts only integer values (float doesn't work, so I had to set it to 2, instead of 1.5)

starting arduino ide with the following command now:
GDK_SCALE=2 /usr/share/arduino/arduino