Creating a DPI-Aware Application

  • Article

To make your application dpi-aware, you must cancel automatic dpi scaling, and then adjust user interface elements to scale appropriately to the system dpi.

DPI scaling in a Win32 application

In Win32 applications, do the following:

  • Use the SetProcessDPIAware function to cancel dpi scaling.
  • When sizing drawn interface elements, use physical measurements, such as centimeters. By using physical dimensions rather than pixels, you ensure consistent sizing on all types of displays.
  • To get the system dpi setting, use the CDC::GetDeviceCaps function with the LOGPIXELSX flag. If you do not cancel dpi scaling, this call returns the default value of 96 dpi.
  • Use the GetSystemMetrics function to get preferred sizes of user interface elements, such as window borders. When dpi scaling is disabled, the measurement values that are returned for interface elements are scaled to the selected dpi setting. If dpi scaling is active, the function returns measurements based on 96 dpi, regardless of the system dpi setting.

DPI scaling in Windows Presentation Foundation and GDI+

Windows Presentation Foundation and GDI+ applications are automatically dpi-aware and do not require the steps described in "DPI scaling in a Win32 application." To ensure that bitmapped graphics scale correctly, all applications, including those developed by using Windows Presentation Foundation and GDI+, should comply with the guidelines in the following section.

Scaling bitmapped graphics

Bitmapped graphics present a challenge to image scaling. If you scale up from a lower-dpi image, beyond a certain point it becomes pixilated and loses quality. If you scale down from a single high-resolution master image, you lose detail.

The best approach is to create multiple versions of each interface bitmap to match the preset dpi settings in Windows Vista. For your high-dpi images, rather than simply scaling larger, consider using the additional space to provide a richer, more detailed and readable image. For example, you can add shading, anti-aliasing, and other effects to improve readability and visual appeal.

It's best to create multiple versions of each interface graphic, with a version that matches each of the following preset dpi settings:

  • 96 dpi: This baseline matches the default dpi setting.
  • 120 dpi: 25% larger than baseline.
  • 144 dpi: 50% larger than baseline.
  • 192 dpi: 100% larger than baseline.

Note  When saving raster images, set the resolution to match the preset dpi settings listed above. Some graphics applications default to a setting of 96 dpi or 72 dpi.

Similarly, you can provide icons in four sizes, as shown in the following table.

DPI setting Icon (SM_CXICON) Small icon (SM_CXSMICON)

96

32x32

16x16

120

40x40

20x20

144

48x48

24x24

192

64x64

32x32

 

When your application renders its user interface, it should match the appropriate bitmap to the system dpi setting. If it is too expensive to create four versions of each interface graphic, consider providing two versions instead. The 96- and 120-dpi settings are most common. If you're deploying an application that's designed for a specific organization, you can optimize for the organization's most common hardware configuration.

Writing High-DPI Win32 Applications

 

 

Send comments about this topic to Microsoft

Build date: 2/8/2011