Often times when we talk about monitors we discuss resolution (e.g.1920×1080) and diagonal dimensions (e.g. 27” or 68.58 cm), but we can use these numbers to calculate the DPI (see More on DPI and PPI below) with the good ol’ Pythagorean theorem. As the screen gets larger, the DPI gets lower, unless you also increase the resolution.
DPI = (sqrt(sqr(width)+sqr(height))/diagonal
Originally Windows monitors assumed monitors were 96 DPI (even though they were usually 72 PPI in reality.) Windows XP added GDI+ allowing resolution-independent text scaling, and Windows Vista added support for High-DPI displays, so more physical pixels could be used to display sharper text and more detailed images. If an app doesn’t indicate it supports High-DPI then it is treated as 96-DPI. Windows 7 expanded on this giving Windows the ability to query the actually pixel density from the monitor. With Windows 10 independent DPI scaling per monitor was added.
When you have a High DPI (>96 DPI) monitor, Windows applies a scale factor so that instead of your content getting really small and hard to read, instead it makes the fonts sharper and the images more detailed.
What does all this mean for you as a developer? 10.3 Rio has new features to help with your High-DPI development with VCL on Windows
- High DPI Image List Support
- Per Monitor V2 Support
- New Styles
- Updated Windows APIs
Marco Cantu did a write-up on the new Per Monitor v2 support, which is support for a new feature in Windows 10 that allows your app to get the correct DPI support for each screen. The DPI Awareness option is in the project Manifest. New VCL projects default to Per Monitor v2, but you will want to update your existing projects.
The VCL automatically handles most of the resizing for you, but there is a new function in the VCL.Classes unit called GetSystemMetricsForWindow that takes advantage of the new GetSystemMetricsForDPI API (with fallback to the old GetSystemMetrics). It will give you metrics, resolution, and DPI for each window of your app, with understanding based on the monitor it currently appears on.
The TControl (and descendants) also has a GetSystemMetrics method which calls the correct function behind the scenes. This makes it easy to migrate your existing code as calls to GetSystemMetrics will automatically get the updated information. As if that wasn’t enough, the TControl also has a CurrentPPI property.
The new High DPI Image List for Windows is an amazing piece of component magic. It introduces two new components: the TImageCollection and TVirtualImageList. David Millington has a write-up on using these components. They make it really easy for your application to automatically take advantage of higher resolution graphic assets on High-DPI displays. This goes beyond the image list functionality built into Windows to make sure your VCL apps look amazing.
Combine those with the great new VCL Styles available in GetIt, and you have everything you need to make your Windows VCL apps look amazing on any monitor under Windows 10. And these are just some of the new or updated features in 10.3 Rio.
 |
If you have 10.3 Rio, then be sure you are taking advantage of them to make all your applications look their best. If not, then you are missing out.
Download the trial or upgrade today!
More on DPI and PPI
DPI is a measure of the density of individual dots that make up an image. These dots may be in print, or other medium, but for now let’s talk about pixels, or the individual elements on the screen that produce images. So DPI is dots per inch, or the count of how many pixels there are within an inch (or 2.54 cm for metric folks, so 254 DPI = 100 DPCM, and 100 DPI = 39.37 DPCM, but we’ll just use DPI).
Since there is technically a difference between a dot of ink on a page, and a pixel on the screen, the correct term for a monitor is Pixels Per Inch (PPI) but DPI is frequently used interchangeably for both. On most monitors there are also sub-pixels, which are the individual color elements (Red, Green, Blue, and maybe White) that make up a single pixel of colors. By varying the intensity of the individual primary colors (sub-pixels) you get a huge variety of colors on the screen.