I recently became the proud owner of a Microsoft Surface PRO device, and was shocked to see that our main software application Vista Advanced looked absolutely horrible!  It felt like half of the UI was tiny, and the other half was massive in size.  The Splash screen graphic was even bad, having been drawn in a tiled display.  Take a look at this first-run / out-of-box experience on the surface running the latest release (4.0.1 at the time of this writing):

Splash screen background image wrapping

Oversized controls and UI elements make the app usability pretty rough

The Problem

The problem, it turns out, has to do with the application’s UI frameworks detecting the selected resize mode for the OS (set to 150% scale by default on high DPI devices like the Surface PRO), and scales up the bitmaps and fonts accordingly.  The really annoying part is that only some of the UI elements are affected by this, and this is due to a combination of different technologies and control libraries being used together to put Advanced together.

The Workaround (read: Hack)

There is a work-around to allow existing versions of Vista Advanced software to look normal on your high DPI device, and the way to do this is to open display resolution in control panel and look for the link that says ‘Make text and other items larger or smaller’.  That link will bring you to the dialog below, and from this dialog set the size of all items to 100% (Smaller).  This affects the entire OS, and has the additional requirement of needing you to log out and back in before the setting will take effect.   This is certainly far from ideal, but in a pinch it’ll at least get you by.

Use display settings to change the default size of items to 100%

The Real Fix

Modification to AssemblyInfo.cs to disable DPI awareness

Luckily there is a simple software fix for this problem that we were able to put in place. Inserting the DisableDpiAwareness attribute at the main application’s assembly level will disable the DPI scaling that happens on these high DPI devices, causing our application to render the same size on all computers.  Setting this attribute immediately brings the application back into it’s normal look and feel:

Normal looking splash screen after setting DisableDpiAwareness

Normal Advanced application look after setting DisableDpiAwareness attribute

Now with this fix, you can see Advanced looks as one might expect it to look again, and without the user having to make any screen resolution hacks to do it.  You’ll see this fix in the next beta version of software (0.55.8), which will roll into version 4.0.2 for those of you who wait for release builds only.