UI becomes blurry on multi-monitor setups with different DPI scaling

[lmalma]

The TablePlus Windows application does not correctly handle DPI scaling when moved between monitors with different scaling factors. This results in a blurry UI, including fonts, icons, and all other visual elements, making the application difficult to use on a secondary display.

The behavior suggests that the application is likely running in System-DPI Aware mode, rather than the more modern Per-Monitor DPI Aware mode. It appears to render itself based on the DPI of the monitor it was launched on and does not dynamically rescale when moved to a new display. Windows then applies bitmap scaling to the window, which causes the blurriness.

Steps to Reproduce

1. Connect two or more monitors to a Windows 10/11 machine.
2. In Windows Display Settings, configure the monitors to have different scaling factors. For example:
   • Monitor 1 (e.g., Laptop display): Set to 150% scaling.
   • Monitor 2 (e.g., External display): Set to 100% scaling.
3. Launch TablePlus on Monitor 1 (the 150% scaled display). The UI appears sharp and is rendered correctly.
4. Drag the TablePlus window from Monitor 1 to Monitor 2 (the 100% scaled display).
5. Observe: The entire application window becomes blurry.
6. (Optional) Close and relaunch the application on Monitor 2. It will now appear sharp on that monitor. If you drag it back to Monitor 1, it will now appear blurry there.

Expected Behavior

The application UI should remain crisp and sharp when moved between displays. It should dynamically detect the change in DPI on the new monitor and re-render its UI elements (text, icons, layout) natively for the new scaling factor.

Actual Behavior

The application window is bitmap-scaled by the Windows DWM (Desktop Window Manager), resulting in a blurry and aliased user interface on the destination monitor.

System Information

• TablePlus Build: 6.6.2 (322)
• Operating System: Windows 11 (also reproducible on Windows 10)

Suggested Solution

Please consider updating the application to support Per-Monitor DPI Awareness (PMAv2). This would involve:

1. Declaring the application as PerMonitorV2 DPI aware in the application manifest.
2. Handling the WM_DPICHANGED window message to dynamically resize and re-render the UI elements when the application is moved to a display with a different DPI.

Implementing full Per-Monitor DPI awareness would resolve this issue and significantly improve the user experience for anyone using a modern multi-monitor setup.

Thank you for developing this excellent tool.

[huyphams]

Very interesting issue, @lmalma. Honestly, we developed the app natively using all the .NET technology, so I'm not sure why Microsoft doesn't handle it automatically