Visual bug in Windows title bar with VCL Styles enabled application and display scaling

8
votes

Currently I am testing various aspects of VCL styles enabled applications.

I noticed, that with Windows scaling higher than the default 96 dpi/100%, the icon and the title bar text of the VCL Form are too big in size - and both are to close together -, please see attached screenshots. This is especially true with higher scalings like 200% or 250% (e.g. used on 4K displays and Windows 10), but even with a scaling of 144 dpi/150%, the problem is already visible.

This is true for all styles delivered with RAD Studio. High Dpi awareness for manifest is enabled via project settings. If I disable VCL Styles in the App, the icon and title bar text is correct in size.

Am I missing something here? Shouldn't the delivered styles work without such display errors out of the box with display scaling enabled? Or is there some setting somewhere I can adjust to fix this.

Thanks,

enter image description here enter image description here

3
delphic++buildervclvcl-styles
It's by no means perfect, but simply adding two space characters at the front of the title of every form is better than nothing, and involves no VCL-hacking. – frogb
This is a comment to the question, not an answer. It does not address fixing the visual bug; it's simply a kludgy workaround. – Ken White
I did also think on that, but if you have like 15 different forms in the app, and load other dlls with forms or execute a TOpenDialog etc., no, this is no solution. – Tom Major

3 Answers

11
votes

VCL Styles do not properly support high DPI scaling.

If you use VCL Styles, then you should remove high DPI awareness from your application manifest.

QP report requesting general high DPI support for VCL Styles: VCL styles don't scale properly under high DPI configurations

Related QC Report for NC area: Styled form's non-client area incorrectly scaled under High DPI

3
votes

Ok, here is my solution for the visual bugs, please see the attached screenshots. I did fixes in 3 places in Vcl.Forms.pas.

The first fix, commented with // Title bar fix 1, addresses the problem that the icon is not correctly drawn, even without scaling, on a default 96dpi Windows with a VCL styled application. I could fix this based on the findings about WM_GETICON, ICON_SMALL2, from James Johnston, https://stackoverflow.com/a/35067909 thanks, James, for that!

The other two fixes address the problem that the icon is drawn too big with display scaling enabled, and that the distance between the icon and the title bar text is too small. These are the fixes commented with // Title bar fix 2 and 3 in the code. GetDpi is just a getter for the current dpi value, which I get from my C sources within the application.

The result is in no way perfect, but it will do for now, with this the VCL styled application is at least acceptable under scaled circumstances.

Thanks to all for your input.

left original, right 'fixed'

Title bar fix 1

Title bar fix variables

Title bar fix 2

Title bar fix 3

0
votes

Here is a unit that allows VCL styles in DPI-aware applications.

VCL.Styles.DPIAware.pas

To use the unit just add it to the implementation uses statement of the main form and add the following code to the FormCreate handler.

procedure TFrmMain.FormCreate(Sender: TObject);
Var
  StyleDPIAwareness : TStyleDPIAwareness;
begin
  StyleDPIAwareness := TStyleDPIAwareness.Create(Self);
  StyleDPIAwareness.Parent := Self;

By default the component scales the styles at multiples of 100%. You can change that, by adding the line:

StyleDPIAwareness.RoundScalingFactor := False;

With this statement styles are scaled to whatever scaling factor results for Screen.PixelsPerInch. Most of the styles would work fine, but a few may show some visual defects.