visual appearance of TAdvOfficeCheckBox in dark mode

Hi I'm using Delphi XE5 on W10 and lost of TMS components, including VCL UI Pack v12.1.0.1
The software I develop has AdvToolBars within AdvPages within a AdvToolbarPager, in order to have a Ribbon-like UI with switchable Styles. This works reasonably well, with some extra source code for switching to dark.

One problem remains with the look of TAdvOfficeCheckBox. As you see in the below image, it is always that 3Dish, white shape, which is somehow acceptable in white and light coloured mode, but really pops out in dark mode. In comparison, the checkboxes in MS Office have been all flat with transparency inside since long, at least since Office 2016, and therefore look fine both in white and dark mode. Is there a setting to influence the look or else could you fix it?

Try to set property AdvOfficeCheckBox.Themed = true

OK thanks, one step forward. This gives me the desired flat appearance. However, the inside always stays white, even if I set it's UIStyle manually in code on switching the app style...
aocbMyCheckbox.UIStyle:=MyStyleDataModule.AdvAppStyler1.Style;

grafik
grafik

I wonder, if there is any solution to this?

We use the Windows API functions to draw the checkbox. The Windows API to draw the checkbox will apparently always draw it with a white background.

Hmmm... So you offer "Office2019Black" styling, but when it comes to actually follow the Microsoft Office styles, it is a Microsoft Windows fault? I do not know the inner workings of Windows vs. Office styling, so I hope I am not left alone on my own with this...

We will investigate what the Windows API offers for dark style.

1 Like

Supposedly, the same topic for the buttons in TAdvOfficeRadioGroup. They can be flattened with Themed:=true, but they stay always white inside...

The Windows Theme drawing API has no overall dark style support.
We implemented a workaround to make this look more appropriate in Office dark styles in the next update.

1 Like

So I just downloaded and installed the new VCL UI Pack version v12.0.2
Again, one step forward but it seems we are not there. Please look below at the screenshots with themed checkboxes and radiobuttons in several color modes:

  • In Office, it consistently keeps a 13x13 pixels box with a single-pixel border in light gray, filled with the same checkmark in all color modes.
  • With TMS, in white modes it looks fair enough like Office. Same for 2016grey. However, in 2016black, 2019grey and 2019black, the empty checkbox has shrivelled to a 10x9 box with white anti-aliased outline, that on checking weirdly morphs into a 12x9 box filled with an "x" character instead of the checkmark.
    Also the radiobutton has become an ellipse inside a 10x9 frame.

Tell if I'm wrong, but this seems not really acceptable to me...

I have explained that the Windows Theme drawing API did not have overall dark mode support and we had to find a workaround (based on using specific chars in a Wingdings font).

Well, if that is the final state (hopefully not), I need to revert to the previous version. Office styling functionality is all about visual appearance. Replacing the already outdated appearance as it was, with the early 1990s Win 3.1 style from the Wingdings font, makes no sense at all. Just no...

We will investigate what we can do.

We applied further improvements that will be included in the next update.

1 Like

Now I installed the most recent version and it is a mixed bag...

All fine for RadioButtons. Unfortunately, for Checkboxes the background is always white. As the checkmark still has the desired colour (light gray for Office206black and whitish for Office2019grey and Officce2019black), this makes TAdvOfficeCheckbox unusable for these themes :flushed:
So, pleeeaase make it work for all themes finally :pray:

We investigated and see there were circumstances where the brush was stuck.
We fixed it now.

OK, very well. Just installed TMS VCL UI Pack v12.1.2.0 and Checkboxes are now coloured properly. I will never understand why Checkboxes and RadioButtons must shrink from a 13x13 size in white themes to a 11x11 size in other themes, but apart from that it is fine.
Thanks!!