Bug 568112 - [Win32][DarkTheme] Use new stuff from Windows 10 - 2021 Spring Update
Summary: [Win32][DarkTheme] Use new stuff from Windows 10 - 2021 Spring Update
Status: NEW
Alias: None
Product: Platform
Classification: Eclipse Project
Component: SWT (show other bugs)
Version: 4.18   Edit
Hardware: PC Windows 10
: P3 normal (vote)
Target Milestone: ---   Edit
Assignee: Platform-SWT-Inbox CLA
QA Contact:
URL:
Whiteboard:
Keywords:
Depends on:
Blocks: 566359 577357
  Show dependency tree
 
Reported: 2020-10-22 11:08 EDT by Alexandr Miloslavskiy CLA
Modified: 2023-03-21 19:16 EDT (History)
6 users (show)

See Also:


Attachments
Windows 10 aero styles, exported from msstyleEditor. (562.04 KB, text/plain)
2022-11-07 08:47 EST, John Moule CLA
no flags Details
Windows 11 aero styles, exported from msstyleEditor. This is the latest Win 11 live product (windows version 10.0.22621.755), available for anyone to install/update on their regular Win PC. (590.75 KB, text/plain)
2022-11-07 08:49 EST, John Moule CLA
no flags Details
Windows 11 aero styles, exported from msstyleEditor. This is from the Windows11 22H2 InsiderPreview. Note, from the MS themes perspective, [2] and [3] are identical. (590.75 KB, text/plain)
2022-11-07 08:49 EST, John Moule CLA
no flags Details
Winmerge diff report of Bug 568112 Description, [1] & [3] (57.08 KB, text/html)
2022-11-07 08:49 EST, John Moule CLA
no flags Details
Side-by-side screenshot of msstyleEditor showing Win10 vs Win11 22H2 preview (257.33 KB, image/png)
2022-11-07 08:50 EST, John Moule CLA
no flags Details
Winmerge diff report of aero.msstyles in Win10 vs Win11 22H2 preview. (16.01 MB, text/html)
2022-11-07 08:50 EST, John Moule CLA
no flags Details
Screenshot of Eclipse 2022-09 checkbox and msstyleEditor of DarkMode_Explorer_Button.CHECKBOX images (97.38 KB, image/png)
2022-11-07 18:26 EST, John Moule CLA
no flags Details
[8] checkboxes - ubuntu 20.04 vs win10 vs win11_22621 (297.01 KB, image/png)
2022-11-16 07:06 EST, John Moule CLA
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Alexandr Miloslavskiy CLA 2020-10-22 11:08:55 EDT
This update finally continues work on Windows's native Dark Theme, bringing these things:

DarkMode::Button
DarkMode::Combobox
DarkMode::Edit
DarkMode::EmptyMarkup
DarkMode::Header
DarkMode::Link
DarkMode::ListView
DarkMode::Listbox
DarkMode::Rebar
DarkMode::ScrollBar
DarkMode::Static
DarkMode::Status
DarkMode::Tab
DarkMode::TaskDialog
DarkMode::Tooltip
DarkMode::Window
DarkMode_Combobox::Edit
DarkMode_Combobox::Listbox
DarkMode_Combobox::ScrollBar
DarkMode_CompositedWindow::Window
DarkMode_Explorer::EmptyMarkup
DarkMode_Explorer::Link
DarkMode_Explorer::ListView

Many of these could be of good use in SWT. I think it's best to continue discussion when the update becomes available to public (so that it's easier to test patches).
Comment 1 Alexandr Miloslavskiy CLA 2020-10-22 13:24:47 EDT
Turns out, I have mistaken 20H2 preview with 21H1 preview. So it will have to wait another half year.

There are some good news, though: since it's already in preview, it's very likely to be there when update lands.
Comment 2 Paul Gardner CLA 2020-10-29 04:55:12 EDT
Looking forward to Windows dark theme support with BiglyBT - as soon as you have something we can test with please let us know!
Comment 3 John Moule CLA 2022-05-16 17:46:55 EDT
Hi Alexandr,

I'm hoping to fix a few of the dark theme bugs and just getting started on this challenge.

My expertise is mainly Java based so I have a learning curve with the Windows native layer. I've followed a few of your comments about availability of proposed windows native fixes for dark themed stuff (566269, 566359). 

1) You mention some windows releases (eg Win11 version 22000.527) missing the proposed fix. Where do you look for them? Is it here for example?
https://support.microsoft.com/en-au/topic/february-15-2022-kb5010414-os-build-22000-527-preview-73e259d0-45ca-45ef-960f-426035104e73

2) Is there any windows API published for dark mode? For instance where are the classes you mention in the description documented?

Thanks for any pointers.

Cheers John Moule
Comment 4 Alexandr Miloslavskiy CLA 2022-05-16 17:55:39 EDT
Alas, the APIs are still not documented. So you can only see them under the hood.

When I mention Windows preview builds, I'm talking about Windows Insider program. You can sign up to it for free and then install preview builds of Windows. I recommend installing these in a VM.

The classes mentioned in Comment 1 can be seen, for example, using 'msstyleEditor' tool [1]

[1] https://github.com/nptr/msstyleEditor
Comment 5 Alexandr Miloslavskiy CLA 2022-05-16 18:00:59 EDT
With 'msstyleEditor', you can open file located at
  %windir%\Resources\Themes\Aero\aero.msstyles

from the Windows version you want to investigate.
Comment 6 John Moule CLA 2022-05-17 04:56:14 EDT
(In reply to Alexandr Miloslavskiy from comment #5)
> With 'msstyleEditor', you can open file located at
>   %windir%\Resources\Themes\Aero\aero.msstyles
> 
> from the Windows version you want to investigate.

Thank you for info and suggestions. I'll try what you suggest.
Comment 7 John Moule CLA 2022-11-07 08:47:26 EST
Created attachment 288810 [details]
Windows 10 aero styles, exported from msstyleEditor.
Comment 8 John Moule CLA 2022-11-07 08:49:09 EST
Created attachment 288811 [details]
Windows 11 aero styles, exported from msstyleEditor. This is the latest Win 11 live product (windows version 10.0.22621.755), available for anyone to install/update on their regular Win PC.
Comment 9 John Moule CLA 2022-11-07 08:49:31 EST
Created attachment 288812 [details]
Windows 11 aero styles, exported from msstyleEditor. This is from the Windows11 22H2 InsiderPreview. Note, from the MS themes perspective, [2] and [3] are identical.
Comment 10 John Moule CLA 2022-11-07 08:49:58 EST
Created attachment 288813 [details]
Winmerge diff report of Bug 568112 Description, [1] & [3]
Comment 11 John Moule CLA 2022-11-07 08:50:25 EST
Created attachment 288814 [details]
Side-by-side screenshot of msstyleEditor showing Win10 vs Win11 22H2 preview
Comment 12 John Moule CLA 2022-11-07 08:50:46 EST
Created attachment 288815 [details]
Winmerge diff report of aero.msstyles in Win10 vs Win11 22H2 preview.
Comment 13 John Moule CLA 2022-11-07 08:52:28 EST
Hi Alexandr,

I've investigated the MS theme changes in recent Windows 11 previews and released products, using 'msstyleEditor' tool. The versions I've considered are:

Windows 10 [1], Windows 11 product update from Sep 2022 [2] and Windows 11 Preview from Oct 2022 [3].

I've created a 3-way diff [4] which shows how things have moved on from the bug's original class list, what I see in my running Win10 system and what is in the recent Win11 product.

The takeaway is that many new classes have been added recently. For example [5] shows what has changed wrt the Button Checkbox; looking at the checkbox images appears to show support for dark mode now. The entire change diffs are shown in [6].

I notice there is a win version number maintained, eg org.eclipse.swt.internal.win32.OS.WIN32_BUILD_WIN11_21H2. I expect a new version should be added for 22H2.

And this version is checked in, for example, org.eclipse.swt.widgets.Button.wmNotifyChild(NMHDR, long, long).

But I'm not really sure how these updated windows assets should be used. Can you give me some direction on this please?


==

[1]: 20191112 Windows10 1909 10.0.18363.2274 - aero.msstyles.txt
Windows 10 aero styles, exported from msstyleEditor.

[2]: 20220920 Windows11 22H2 10.0.22621.755 - aero.msstyles.txt
Windows 11 aero styles, exported from msstyleEditor. This is the latest Win 11 live product (windows version 10.0.22621.755), available for anyone to install/update on their regular Win PC.

[3]: 20221020 Windows11 22H2 InsiderPreview Release Preview Channel Build 22621 - aero.msstyles.txt
Windows 11 aero styles, exported from msstyleEditor. This is from the Windows11 22H2 InsiderPreview.
Note, from the MS themes perspective, [2] and [3] are identical.

[4]: diff - Bug 568112 Description vs Win10 vs Win11 22H2.htm
Winmerge diff report of Bug 568112 Description, [1] & [3]

[5]: msstyleEditor - win10 vs win11-22H2preview - Button - Checkbox.PNG
Side-by-side screenshot of msstyleEditor showing Win10 vs Win11 22H2 preview

[6]: diff - Windows10 1909 10.0.18363.2274 vs Windows11 22H2 InsiderPreview Release Preview Channel Build 22621 - aero.msstyles.htm
Winmerge diff report of aero.msstyles in Win10 vs Win11 22H2 preview.
Comment 14 Alexandr Miloslavskiy CLA 2022-11-07 09:54:26 EST
Once dark mode is enabled for control, such as 'DarkMode::Button', it automatically applies all nested parts of it.

If you say that for example in newer Windows, CHECKBOX part of 'DarkMode::Button' is updated, the update will apply automatically. All you need is to actually set 'DarkMode::Button' in SWT.
Comment 15 Alexandr Miloslavskiy CLA 2022-11-07 09:55:50 EST
See 'maybeEnableDarkSystemTheme()'. After it's called, it will change the Control to use the corresponding 'DarkTheme::' variation of Control.
Comment 16 John Moule CLA 2022-11-07 18:26:31 EST
Created attachment 288819 [details]
Screenshot of Eclipse 2022-09 checkbox and msstyleEditor of DarkMode_Explorer_Button.CHECKBOX images
Comment 17 John Moule CLA 2022-11-07 18:27:18 EST
(In reply to Alexandr Miloslavskiy from comment #15)
> See 'maybeEnableDarkSystemTheme()'. After it's called, it will change the
> Control to use the corresponding 'DarkTheme::' variation of Control.

Hi Alexandr,

Yes in org.eclipse.swt.widgets.Button.createHandle() I can see maybeEnableDarkSystemTheme() being used.

But it doesn't look like I expected it to. I tried running Eclipse 2022-09 in dark mode, in my new Win11 22H2 VM and checkboxes have a blue background - see [7]. I was expecting a dark background.
[7] also shows the msstyleEditor focussed on CHECKBOX which shows a number of images, some blue, some dark. Can you tell me how the choice of image works?

[7] Win11 22H2 - Eclipse 2022-09 checkbox, aero.msstyles DarkMode_Explorer_Button.CHECKBOX.PNG
Screenshot of Eclipse 2022-09 checkbox and msstyleEditor of DarkMode_Explorer_Button.CHECKBOX images
Comment 18 Alexandr Miloslavskiy CLA 2022-11-09 15:50:56 EST
> and checkboxes have a blue background

You need patch: https://github.com/eclipse-platform/eclipse.platform.swt/pull/424
A clear indication of that is that your scrollbars are light.

You might want to just download a recent Eclipse IBuild: https://download.eclipse.org/eclipse/downloads/
Make sure to download something that was built later than the patch was merged (2022-10-12).

> also shows the msstyleEditor focussed on CHECKBOX which shows a number of images, some blue, some dark. Can you tell me how the choice of image works?

I think that every control has secret offsets in the image for its various states. Judging from what I see, it's somewhat related to states listed on the right pane of msstyleeditor.
Comment 19 John Moule CLA 2022-11-16 07:06:42 EST
Created attachment 288842 [details]
[8] checkboxes - ubuntu 20.04 vs win10 vs win11_22621

Shows how checkboxes look across different platforms in dark mode:
ubuntu 20.04 vs win10 vs win11_22621
Ubuntu on LHS and Win11 on RHS.

On Win11 unselected checkboxes have a dark BG. Selected checkboxes have a blue BG. As opposed to Ubuntu where the checkbox BG is dark irrespectve of selection.
Comment 20 John Moule CLA 2022-11-16 07:10:39 EST
(In reply to Alexandr Miloslavskiy from comment #18)
> Make sure to download something that was built later than the patch was
> merged (2022-10-12).

Done. I've oomph installed Platform wavefront on all platforms to provide a comparison. See attachment: [8] checkboxes - ubuntu 20.04 vs win10 vs win11_22621.PNG

> I think that every control has secret offsets in the image for its various 
> states. Judging from what I see, it's somewhat related to states listed on the 
> right pane of msstyleeditor.

Yes that I see that too. But I'm not sure what needs doing in SWT to access those offsets.
Comment 21 Alexandr Miloslavskiy CLA 2022-11-17 15:21:33 EST
> On Win11 unselected checkboxes have a dark BG. Selected checkboxes have a blue BG. 

That's the proper Win11 dark theme.

> As opposed to Ubuntu where the checkbox BG is dark irrespectve of selection

Designers huh. There's no expectation that different OS will be designed in the same way.

> But I'm not sure what needs doing in SWT to access those offsets.

I don't see a need to do anything here. SWT tries to fit platform's I appearance more than that of other platforms.
Comment 22 John Moule CLA 2022-11-21 18:27:23 EST
(In reply to Alexandr Miloslavskiy from comment #21)
> > On Win11 unselected checkboxes have a dark BG. Selected checkboxes have a blue BG. 
> 
> That's the proper Win11 dark theme.
> 
> > As opposed to Ubuntu where the checkbox BG is dark irrespectve of selection
> 
> Designers huh. There's no expectation that different OS will be designed in
> the same way.
> 
> > But I'm not sure what needs doing in SWT to access those offsets.
> 
> I don't see a need to do anything here. SWT tries to fit platform's I
> appearance more than that of other platforms.

Hi Alexandr,

Thanks for your comments, that's good to know.

I've updated:
Bug 566269 - [Win32][Dark theme] Check boxes light in the dark theme
https://bugs.eclipse.org/bugs/show_bug.cgi?id=566269



Do you think it's worth me creating a new GH Issue which lists the outstanding widgets that still have light backgrounds (as of Windows11 22H2 10.0.22621)?