Bug 563282

Summary: Access to System Accent color
Product: [Eclipse Project] Platform Reporter: Philippe Dul <philippe.dul>
Component: SWTAssignee: Platform-SWT-Inbox <platform-swt-inbox>
Status: NEW --- QA Contact:
Severity: normal    
Priority: P3 CC: 1520080049, alexandr.miloslavskiy, aobuchow, Lars.Vogel
Version: 4.16   
Target Milestone: ---   
Hardware: PC   
OS: Windows 10   
See Also: https://git.eclipse.org/r/163170
Whiteboard:
Attachments:
Description Flags
accent-swt-control.png
none
theme-with-accent.png none

Description Philippe Dul CLA 2020-05-18 06:23:49 EDT
Created attachment 282905 [details]
accent-swt-control.png

In Windows and Mac (and I think in some Linux versions), the system defines a color called "accent color" which is the main color of the theme.

https://docs.microsoft.com/en-us/windows/uwp/design/style/color#accent-color
https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/color/

This draft gerrit patch adds a SWT.COLOR_SYSTEM_ACCENT constant and a windows implementation

The constant is accessible in code and in css themes, as "COLOR-SYSTEM-ACCENT". 
For instance with bug 497586, it would be possible to use it in Eclipse Theme such as theme-with-accent.png sample


In Windows, this color is provided by dwmapi.dll / dwmgetcolorizationcolor method.
https://docs.microsoft.com/en-us/windows/win32/api/dwmapi/nf-dwmapi-dwmgetcolorizationcolor

Another way would be to fix the TITLE_BACKGROUND color on windows to reflect this accent color as shown in accent-swt-control.png, it still reflect the legacy title color.

Of course its just a draft, with no target milestone.
what do you think of this? To be discussed.
Comment 1 Philippe Dul CLA 2020-05-18 06:24:15 EDT
Created attachment 282907 [details]
theme-with-accent.png
Comment 2 Eclipse Genie CLA 2020-05-18 06:25:27 EDT
New Gerrit change created: https://git.eclipse.org/r/163170
Comment 3 Alexandr Miloslavskiy CLA 2020-05-18 12:05:39 EDT
What was your use case that needed this change?
Comment 4 Andrew Obuchowicz CLA 2020-05-18 14:40:22 EDT
I think this is an /awesome/ idea!! It'd be a good way to use the active-tab-highlight and keep things consistent with the user's OS colors.

I'm personally totally for it :) +1
Comment 5 Philippe Dul CLA 2020-05-18 15:43:17 EDT
For the meaning of System Accent color, i think the Windows one is nice:

https://docs.microsoft.com/en-us/windows/uwp/design/style/color
https://docs.microsoft.com/en-us/windows/uwp/design/style/color#color-principles

Use color meaningfully. When color is used sparingly to highlight important elements, it can help create a user interface that is fluid and intuitive.

Use color to indicate interactivity. It's a good idea to choose one color to indicate elements of your application that are interactive. For example, many web pages use blue text to denote a hyperlink.

Color is personal. In Windows, users can choose an accent color and a light or dark theme, which are reflected throughout their experience. You can choose how to incorporate the user's accent color and theme into your application, personalizing their experience.

Color is cultural. Consider how the colors you use will be interpreted by people from different cultures. For example, in some cultures the color blue is associated with virtue and protection, while in others it represents mourning.

-- 

For the uses, I see several use cases, but platform ui team will have probably some:
- The one from bug 497586 (theme-with-accent.png) where the Eclipse default theme can be consistent with the user's OS colors

- By implementing calc() function in css engine (https://developer.mozilla.org/fr/docs/Web/CSS/calc) we can imagine compute some gradients of the System Accent, making theme more user-color related. like: https://docs.microsoft.com/en-us/windows/uwp/design/style/color#accent-color-palette)

- As there is now major releases every 3 months, this draft-integration is a step-forward for better integration of SWT into modern color principles. [1][2][3]



[1] https://docs.microsoft.com/fr-fr/windows/uwp/design/style/color
[2] https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/color/
[3] https://material.io/design/color/the-color-system.html#color-theme-creation
Comment 6 Alexandr Miloslavskiy CLA 2020-05-19 08:08:36 EDT
Thanks for the explanation.

I feel that this change is outside of my scope of interests. I only had a look at the patch because Lars asked me to and I saw some problems with it.
Comment 7 Gao Hao CLA 2020-06-12 09:26:55 EDT
In some linux machine, the title bar's height is extremely high, which is so ugly. So, can you control the height of Eclipse title bar?
Comment 8 Lars Vogel CLA 2020-06-12 09:32:20 EDT
(In reply to Gao Hao from comment #7)
> In some linux machine, the title bar's height is extremely high, which is so
> ugly. So, can you control the height of Eclipse title bar?

Please avoid unrelated questions in bug reports.