Windowscommunitytoolkit: [Feature] Add perceived luminance helper

Created on 23 May 2020  路  8Comments  路  Source: windows-toolkit/WindowsCommunityToolkit

Describe the problem this feature would solve

For a given color, it would be useful to know the contrasting color for displaying text (white/black). This can also be useful to determine the RequestedTheme for a control based on a given background color.

Describe the solution

A new helper method would be added to ColorHelpers class, which would calculate perceived luminance for a given color using the following formula (based on W3C):

( 0.299 * color.R + 0.587 * color.G + 0.114 * color.B)/255

The result would be a number between 0 and 1, for 0.5 being the boundary between black/white foreground color.

Describe alternatives you've considered

The method could also be added as an extension method on the Windows.UI.Color type.

feature request open discussion

Most helpful comment

Thanks @MartinZikmund, I've assigned to you to drive this work. Seems like there's an opportunity here to have a couple of different helpers/solutions for various scenarios. :)

All 8 comments

Hello, 'MartinZikmund! Thanks for submitting a new feature request. I've automatically added a vote 馃憤 reaction to help get things started. Other community members can vote to help us prioritize this feature in the future!

If this would be a welcome addition, I will be happy to implement it.

I had a similar thought in a couple of the WinUI issues. Some kind of ContrastBrush.

You provide it two colours, one for a Light contrast, one for a Dark contrast. The brush then _looks at_ the pixel colour below/behind it and then chooses which ever of the two colours offers the better contrast ratio.

This would work well with the Fluent Theme Editor which allows for overriding of the Theme colours, by default could use Black and White colours, and may be useful for High Contrast theme usage,

As a brush, it could be applied in XAML, and would not need code-behind for each use of it.

@mdtauk I like that idea as well, is there an issue for this?

In my specific scenario the C#-based solution is ok, as I only need to decide if I want to set ElementTheme to light or dark based on the provided background color.

@MartinZikmund Thanks for considering to work on this feature. I like the idea and it seems like @mdtauk have a similar idea that seems to be closely aligned with it too.

Let's see what devs think about this 馃

Thanks @MartinZikmund, I've assigned to you to drive this work. Seems like there's an opportunity here to have a couple of different helpers/solutions for various scenarios. :)

@mdtauk how would the contrast brush work for non-uniform backgrounds?

That is a good question. I'm not sure of any good way for the Xaml rendering to "read the pixel colour" let alone grab a range of pixels and perform the equivalent of an Average blur filter to find the average pixel colour

Was this page helpful?
0 / 5 - 0 ratings

Related issues

nolanblew picture nolanblew  路  3Comments

andriihorpenko picture andriihorpenko  路  3Comments

michael-hawker picture michael-hawker  路  4Comments

Joebeazelman picture Joebeazelman  路  3Comments

HardySoftware picture HardySoftware  路  3Comments