ColorPicker with ColorSlider

[sonnemaf]

Hi,

The ColorSlider of a ColorPicker is working strange and makes the control useless.

Describe the bug

I have tried to use the the Microsoft.UI.Xaml ColorPicker (and also the UWP one) with the ColorSpectrumComponents value set to "SaturationValue".

<ColorPicker ColorSpectrumShape="Box"
             Color="Red"
             Width="312"
             IsColorChannelTextInputVisible="False"
             IsColorSliderVisible="True"
             IsAlphaEnabled="False"
             IsHexInputVisible="False"
             RenderTransformOrigin="0.5,0.5"
             ColorSpectrumComponents="SaturationValue" />

The Xaml above renders this output which really looks great. You can use the slider to pick another color.

The problem starts when you set the Color to Black or White.
 

<ColorPicker ColorSpectrumShape="Box"
             Color="Black"
             Width="312"
             IsColorChannelTextInputVisible="False"
             IsColorSliderVisible="True"
             IsAlphaEnabled="False"
             IsHexInputVisible="False"
             RenderTransformOrigin="0.5,0.5"
             ColorSpectrumComponents="SaturationValue" />

The color slider becomes completely Black and with White it ‘disappears’. I expected the rainbow color which I had when the color was set to Red. Is this a bug?

Maybe I shouldn't use the ColorSpectrumComponents, so I set it back to the default (HueSaturation) and set the Color to Black.
 

<ColorPicker ColorSpectrumShape="Box"
             Color="Black"
             Width="312"
             IsColorChannelTextInputVisible="False"
             IsColorSliderVisible="True"
             IsAlphaEnabled="False"
             IsHexInputVisible="False"
             RenderTransformOrigin="0.5,0.5"
             ColorSpectrumComponents="HueSaturation" />

 
Does this look like a ColorPicker? I don’t think so. Is this a bug?
 

For me the Color Picker with a Color Slider is useless. Or am I stupid and doing something wrong?
 

Expected behavior
The ColorPicker in the Paint 3D app is doing what I want. Does anybody know if the ColorPicker which is in the Paint 3D app is available as a component?

Version Info
Windows 10 Desktop, 1809, 17763, WinUI NuGet 2.0.181018003

NuGet package version:
Microsoft.UI.Xaml 2.0.181018003

Windows 10 version:

• Insider Build (xxxxx)
• October 2018 Update (17763)
• April 2018 Update (17134)
• Fall Creators Update (16299)
• Creators Update (15063)
• Anniversary Update (14393)

Device form factor:

• Desktop
• Mobile
• Xbox
• Surface Hub
• IoT

Additional context

[jevansaks]

This sounds like an issue that @kikisaints and @llongley might have addressed with a behavior change recently. I don't believe that update is in a package on the feed yet however. Would you be able to try the nupkg from the latest CI build? You can click the "Artifacts" button to download it. Here's the description from the PR before we went open:

The motivation behind this task was to remove the possibility that the user can interact with the ColorPicker in such a way as to create a case where either the color spectrum or the color slider are just displaying one solid color rather than a gradient. In the case of the spectrum, this can happen when value = 0 - in that case, you get black, regardless of any other component. In the case of the slider, this can additionally happen when the slider is tracking hue and saturation = 0, which will make the entire slider white. In those cases, we want to not update the visuals, since otherwise we aren't displaying meaningful, helpful information to the user.

I don't know the answer for what control Paint3D is using, Kiki might know. I suspect they wrote something custom.

[sonnemaf]

Yeah! It is fixed in the 2.1.181213001-prerelease which I downloaded. I hope it will be released soon!

I have also tried it using the normal (UWP) ColorPicker on a Windows Insider Build (18290). It is fixed in there too.

Thanks!

(cc @crutkas)

Fons

[michael-hawker]

Great to see this fixed!

[jevansaks]

The fix is in a prerelease nuget package, take it for a spin! https://www.nuget.org/packages/Microsoft.UI.Xaml/2.1.181217001-prerelease

[sonnemaf]

Yeah, it also works in the 2.1.181217001-prerelease. Thanks and a Merry Christmas.