Created ContrastHelper samples

Avid29 · Avid29 · commit 1f076412b3e2 · 2025-10-10T21:01:27.000+03:00
diff --git a/components/ColorAnalyzer/samples/ContrastHelper.md b/components/ColorAnalyzer/samples/ContrastHelper.md
@@ -0,0 +1,23 @@
+---
+title: ContrastHelper
+author: Avid29
+description: A tool for extracting colors from an image
+keywords: Color, Helpers
+dev_langs:
+  - csharp
+category: Helpers
+subcategory: Miscellaneous
+discussion-id: 254
+issue-id: 0
+icon: assets/icon.png
+---
+
+# ContrastHelper
+
+### Using on TextBlocks or Controls
+
+> [!Sample TextBlockContrastSample]
+
+### Using on SolidColorBrush
+
+> [!Sample SolidColorBrushContrastSample]
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/ContrastHelperSample.xaml b/components/ColorAnalyzer/samples/ContrastHelper/ContrastHelperSample.xaml
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/ContrastHelperSampleBase.cs b/components/ColorAnalyzer/samples/ContrastHelper/ContrastHelperSampleBase.cs
@@ -2,25 +2,24 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
-using Microsoft.UI;
 using Windows.UI;
 
 namespace ColorAnalyzerExperiment.Samples;
 
-/// <summary>
-/// An example sample page of a custom control inheriting from Panel.
-/// </summary>
-[ToolkitSample(id: nameof(ContrastHelperSample), "ContrastAnalyzer helper", description: $"A sample for showing how the contrast analyzer can be used.")]
-public sealed partial class ContrastHelperSample : Page
+public abstract partial class ContrastHelperSampleBase : Page
 {
     public static readonly DependencyProperty DesiredBackgroundProperty =
-        DependencyProperty.Register(nameof(DesiredBackground), typeof(Color), typeof(ContrastHelperSample), new PropertyMetadata(Colors.Black));
+        DependencyProperty.Register(nameof(DesiredBackground), typeof(Color), typeof(TextBlockContrastSample), new PropertyMetadata(Colors.Black));
 
     public static readonly DependencyProperty DesiredForegroundProperty =
-        DependencyProperty.Register(nameof(DesiredForeground), typeof(Color), typeof(ContrastHelperSample), new PropertyMetadata(Colors.White));
+        DependencyProperty.Register(nameof(DesiredForeground), typeof(Color), typeof(TextBlockContrastSample), new PropertyMetadata(Colors.White));
 
     private static readonly DependencyProperty MinRatioProperty =
-        DependencyProperty.Register(nameof(MinRatio), typeof(double), typeof(ContrastHelperSample), new PropertyMetadata(0d));
+        DependencyProperty.Register(nameof(MinRatio), typeof(double), typeof(TextBlockContrastSample), new PropertyMetadata(3d));
+
+    public ContrastHelperSampleBase()
+    {
+    }
 
     public Color DesiredBackground
     {
@@ -39,9 +38,4 @@ public double MinRatio
         get => (double)GetValue(MinRatioProperty);
         set => SetValue(MinRatioProperty, value);
     }
-
-    public ContrastHelperSample()
-    {
-        this.InitializeComponent();
-    }
 }
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/ContrastOptionsPane.xaml b/components/ColorAnalyzer/samples/ContrastHelper/ContrastOptionsPane.xaml
@@ -1,4 +1,4 @@
-﻿<UserControl x:Class="ColorAnalyzerExperiment.Samples.ContrastOptionsPane"
+<UserControl x:Class="ColorAnalyzerExperiment.Samples.ContrastOptionsPane"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:controls="using:CommunityToolkit.WinUI.Controls"
@@ -8,34 +8,30 @@
              mc:Ignorable="d">
 
     <StackPanel Spacing="2">
-        <TextBlock Text="Desired Foreground" />
-        <controls:ColorPicker ColorChanged="Foreground_ColorChanged"
-                              IsColorChannelTextInputVisible="True"
-                              IsColorSliderVisible="True"
-                              Color="White" />
-
-        <TextBlock Text="Background" />
-        <controls:ColorPicker ColorChanged="Background_ColorChanged"
-                              IsColorChannelTextInputVisible="True"
-                              IsColorSliderVisible="True"
-                              Color="Black" />
+        <StackPanel Orientation="Horizontal">
+            <StackPanel>
+                <TextBlock Text="Desired Foreground" />
+                <controls:ColorPicker ColorChanged="Foreground_ColorChanged"
+                                      IsColorChannelTextInputVisible="True"
+                                      IsColorSliderVisible="True"
+                                      Color="White" />
+            </StackPanel>
+            <StackPanel>
+                <TextBlock Text="Background" />
+                <controls:ColorPicker ColorChanged="Background_ColorChanged"
+                                      IsColorChannelTextInputVisible="True"
+                                      IsColorSliderVisible="True"
+                                      Color="Black" />
+            </StackPanel>
+        </StackPanel>
 
         <Slider Header="Minimum Ratio"
                 Maximum="21"
                 Minimum="1"
+                StepFrequency="0.1"
                 ValueChanged="Ratio_ValueChanged"
+                HorizontalAlignment="Center"
+                MinWidth="256"
                 Value="3" />
-
-        <Slider Header="Font Size"
-                Maximum="48"
-                Minimum="8"
-                ValueChanged="FontSize_ValueChanged"
-                Value="18" />
-
-        <Slider Header="Stroke Thickness"
-                Maximum="8"
-                Minimum="0"
-                ValueChanged="Thickness_ValueChanged"
-                Value="4" />
     </StackPanel>
 </UserControl>
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/ContrastOptionsPane.xaml.cs b/components/ColorAnalyzer/samples/ContrastHelper/ContrastOptionsPane.xaml.cs
@@ -10,16 +10,15 @@
 
 namespace ColorAnalyzerExperiment.Samples;
 
-[ToolkitSampleOptionsPane(nameof(ContrastHelperSample))]
+[ToolkitSampleOptionsPane(nameof(TextBlockContrastSample))]
+[ToolkitSampleOptionsPane(nameof(SolidColorBrushContrastSample))]
 public partial class ContrastOptionsPane : UserControl
 {
-    private ContrastHelperSample _sample;
-    private ContrastHelperSample.XamlNamedPropertyRelay _sampleXamlRelay;
+    private ContrastHelperSampleBase _sample;
     
-    public ContrastOptionsPane(ContrastHelperSample sample)
+    public ContrastOptionsPane(ContrastHelperSampleBase sample)
     {
         _sample = sample;
-        _sampleXamlRelay = new ContrastHelperSample.XamlNamedPropertyRelay(sample);
         
         this.InitializeComponent();
     }
@@ -46,14 +45,4 @@ private void Ratio_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
     {
         _sample.MinRatio = (double)e.NewValue;
     }
-
-    private void FontSize_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
-    {
-        _sampleXamlRelay.TextSample.FontSize = (double)e.NewValue;
-    }
-
-    private void Thickness_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
-    {
-        _sampleXamlRelay.ShapeSample.StrokeThickness = (double)e.NewValue;
-    }
 }
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/SolidColorBrushContrastSample.xaml b/components/ColorAnalyzer/samples/ContrastHelper/SolidColorBrushContrastSample.xaml
@@ -0,0 +1,37 @@
+<!--  Licensed to the .NET Foundation under one or more agreements. The .NET Foundation licenses this file to you under the MIT license. See the LICENSE file in the project root for more information.  -->
+<local:ContrastHelperSampleBase x:Class="ColorAnalyzerExperiment.Samples.SolidColorBrushContrastSample"
+                                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                                xmlns:behaviors="using:CommunityToolkit.WinUI.Behaviors"
+                                xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+                                xmlns:helpers="using:CommunityToolkit.WinUI.Helpers"
+                                xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
+                                xmlns:local="using:ColorAnalyzerExperiment.Samples"
+                                xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+                                mc:Ignorable="d">
+    <local:ContrastHelperSampleBase.Background>
+        <SolidColorBrush Color="{x:Bind DesiredBackground, Mode=OneWay}" />
+    </local:ContrastHelperSampleBase.Background>
+
+    <StackPanel Margin="20" HorizontalAlignment="Center" VerticalAlignment="Center">
+        <Rectangle Width="64"
+                   Height="48"
+                   StrokeThickness="2">
+            <Rectangle.Stroke>
+                <SolidColorBrush x:Name="BoundBrush"
+                                 Color="{x:Bind DesiredForeground, Mode=OneWay}"
+                                 helpers:ContrastHelper.MinRatio="{x:Bind MinRatio, Mode=OneWay}"
+                                 helpers:ContrastHelper.Opponent="{x:Bind DesiredBackground, Mode=OneWay}"/>
+            </Rectangle.Stroke>
+        </Rectangle>
+        <TextBlock Text="{x:Bind BoundBrush.(helpers:ContrastHelper.ContrastRatio), Mode=OneWay}"
+                   helpers:ContrastHelper.MinRatio="{x:Bind MinRatio, Mode=OneWay}"
+                   helpers:ContrastHelper.Opponent="{x:Bind DesiredBackground, Mode=OneWay}"
+                   FontSize="24">
+            <TextBlock.Foreground>
+                <SolidColorBrush Color="{x:Bind DesiredForeground, Mode=OneWay}" />
+            </TextBlock.Foreground>
+        </TextBlock>
+    </StackPanel>
+    
+</local:ContrastHelperSampleBase>
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/SolidColorBrushContrastSample.xaml.cs b/components/ColorAnalyzer/samples/ContrastHelper/SolidColorBrushContrastSample.xaml.cs
@@ -0,0 +1,17 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+namespace ColorAnalyzerExperiment.Samples;
+
+/// <summary>
+/// An example sample page of a custom control inheriting from Panel.
+/// </summary>
+[ToolkitSample(id: nameof(SolidColorBrushContrastSample), "ContrastAnalyzer helper", description: $"A sample for showing how the contrast analyzer can be used.")]
+public sealed partial class SolidColorBrushContrastSample : ContrastHelperSampleBase
+{
+    public SolidColorBrushContrastSample()
+    {
+        this.InitializeComponent();
+    }
+}
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/TextBlockContrastSample.xaml b/components/ColorAnalyzer/samples/ContrastHelper/TextBlockContrastSample.xaml
@@ -0,0 +1,37 @@
+<!--  Licensed to the .NET Foundation under one or more agreements. The .NET Foundation licenses this file to you under the MIT license. See the LICENSE file in the project root for more information.  -->
+<local:ContrastHelperSampleBase x:Class="ColorAnalyzerExperiment.Samples.TextBlockContrastSample"
+                                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                                xmlns:behaviors="using:CommunityToolkit.WinUI.Behaviors"
+                                xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+                                xmlns:helpers="using:CommunityToolkit.WinUI.Helpers"
+                                xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
+                                xmlns:local="using:ColorAnalyzerExperiment.Samples"
+                                xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+                                mc:Ignorable="d">
+    <local:ContrastHelperSampleBase.Background>
+        <SolidColorBrush Color="{x:Bind DesiredBackground, Mode=OneWay}" />
+    </local:ContrastHelperSampleBase.Background>
+
+    <StackPanel Orientation="Horizontal" Margin="20" HorizontalAlignment="Center" VerticalAlignment="Center">
+        <TextBlock x:Name="BoundTextBlock"
+                   Text="Contrast Ratio:"
+                   helpers:ContrastHelper.MinRatio="{x:Bind MinRatio, Mode=OneWay}"
+                   helpers:ContrastHelper.Opponent="{x:Bind DesiredBackground, Mode=OneWay}"
+                   FontSize="24">
+            <TextBlock.Foreground>
+                <SolidColorBrush Color="{x:Bind DesiredForeground, Mode=OneWay}" />
+            </TextBlock.Foreground>
+        </TextBlock>
+        <TextBlock Text="{x:Bind BoundTextBlock.(helpers:ContrastHelper.ContrastRatio), Mode=OneWay}"
+                   helpers:ContrastHelper.MinRatio="{x:Bind MinRatio, Mode=OneWay}"
+                   helpers:ContrastHelper.Opponent="{x:Bind DesiredBackground, Mode=OneWay}"
+                   FontSize="24"
+                   Margin="4,0,0,0">
+            <TextBlock.Foreground>
+                <SolidColorBrush Color="{x:Bind DesiredForeground, Mode=OneWay}" />
+            </TextBlock.Foreground>
+        </TextBlock>
+    </StackPanel>
+    
+</local:ContrastHelperSampleBase>
diff --git a/components/ColorAnalyzer/samples/ContrastHelper/TextBlockContrastSample.xaml.cs b/components/ColorAnalyzer/samples/ContrastHelper/TextBlockContrastSample.xaml.cs
@@ -0,0 +1,17 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+namespace ColorAnalyzerExperiment.Samples;
+
+/// <summary>
+/// An example sample page of a custom control inheriting from Panel.
+/// </summary>
+[ToolkitSample(id: nameof(TextBlockContrastSample), "ContrastAnalyzer helper", description: $"A sample for showing how the contrast analyzer can be used.")]
+public sealed partial class TextBlockContrastSample : ContrastHelperSampleBase
+{
+    public TextBlockContrastSample()
+    {
+        this.InitializeComponent();
+    }
+}
diff --git a/components/ColorAnalyzer/src/ColorExtensions.cs b/components/ColorAnalyzer/src/ColorExtensions.cs
@@ -38,7 +38,7 @@ internal static double ContrastRatio(this Color color1, Color color2)
         double darker = Math.Min(luminance1, luminance2);
 
         // Calculate contrast ratio
-        return (lighter + 0.05f) / (darker + 0.05f);
+        return (lighter + 0.05) / (darker + 0.05);
     }
 
     internal static double PerceivedLuminance(this Color color)
diff --git a/components/ColorAnalyzer/src/ContrastHelper/ContrastHelper.Properties.cs b/components/ColorAnalyzer/src/ContrastHelper/ContrastHelper.Properties.cs
@@ -115,21 +115,39 @@ public partial class ContrastHelper
     /// </summary>
     public static double GetContrastRatio(DependencyObject obj) => (double)obj.GetValue(ContrastRatioProperty);
 
-    private static void SetContrastRatio(DependencyObject obj, double value) => obj.SetValue(ContrastRatioProperty, value);
+    /// <summary>
+    /// Sets the calculated contrast ratio compared to the actual foreground color.
+    /// </summary>
+    /// <remarks>
+    /// This must be provided for binding, but should be treated as if it were private.
+    /// </remarks>
+    public static void SetContrastRatio(DependencyObject obj, double value) => obj.SetValue(ContrastRatioProperty, value);
 
     /// <summary>
     /// Gets the calculated contrast ratio compared to the original foreground color.
     /// </summary>
     public static double GetOriginalContrastRatio(DependencyObject obj) => (double)obj.GetValue(OriginalContrastRatioProperty);
 
-    private static void SetOriginalContrastRatio(DependencyObject obj, double value) => obj.SetValue(OriginalContrastRatioProperty, value);
+    /// <summary>
+    /// Sets the calculated contrast ratio compared to the original foreground color.
+    /// </summary>
+    /// <remarks>
+    /// This must be provided for binding, but should be treated as if it were private.
+    /// </remarks>
+    public static void SetOriginalContrastRatio(DependencyObject obj, double value) => obj.SetValue(OriginalContrastRatioProperty, value);
 
     /// <summary>
     /// Gets the original color before adjustment for contrast.
     /// </summary>
     public static Color GetOriginalColor(DependencyObject obj) => (Color)obj.GetValue(OriginalColorProperty);
 
-    private static void SetOriginalColor(DependencyObject obj, Color color) => obj.SetValue(OriginalColorProperty, color);
+    /// <summary>
+    /// Sets the original color before adjustment for contrast.
+    /// </summary>
+    /// <remarks>
+    /// This must be provided for binding, but should be treated as if it were private.
+    /// </remarks>
+    public static void SetOriginalColor(DependencyObject obj, Color color) => obj.SetValue(OriginalColorProperty, color);
 
     private static DependencyObject GetCallbackObject(DependencyObject obj) => (DependencyObject)obj.GetValue(CallbackObjectProperty);
 

Original file line number	Diff line number	Diff line change
`@@ -10,16 +10,15 @@`
`10`	`10`
`11`	`11`	`namespace ColorAnalyzerExperiment.Samples;`
`12`	`12`
`13`		`-[ToolkitSampleOptionsPane(nameof(ContrastHelperSample))]`
	`13`	`+[ToolkitSampleOptionsPane(nameof(TextBlockContrastSample))]`
	`14`	`+[ToolkitSampleOptionsPane(nameof(SolidColorBrushContrastSample))]`
`14`	`15`	`public partial class ContrastOptionsPane : UserControl`
`15`	`16`	`{`
`16`		`- private ContrastHelperSample _sample;`
`17`		`- private ContrastHelperSample.XamlNamedPropertyRelay _sampleXamlRelay;`
	`17`	`+ private ContrastHelperSampleBase _sample;`
`18`	`18`
`19`		`- public ContrastOptionsPane(ContrastHelperSample sample)`
	`19`	`+ public ContrastOptionsPane(ContrastHelperSampleBase sample)`
`20`	`20`	`{`
`21`	`21`	`_sample = sample;`
`22`		`- _sampleXamlRelay = new ContrastHelperSample.XamlNamedPropertyRelay(sample);`
`23`	`22`
`24`	`23`	`this.InitializeComponent();`
`25`	`24`	`}`
`@@ -46,14 +45,4 @@ private void Ratio_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)`
`46`	`45`	`{`
`47`	`46`	`_sample.MinRatio = (double)e.NewValue;`
`48`	`47`	`}`
`49`		`-`
`50`		`- private void FontSize_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)`
`51`		`- {`
`52`		`- _sampleXamlRelay.TextSample.FontSize = (double)e.NewValue;`
`53`		`- }`
`54`		`-`
`55`		`- private void Thickness_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)`
`56`		`- {`
`57`		`- _sampleXamlRelay.ShapeSample.StrokeThickness = (double)e.NewValue;`
`58`		`- }`
`59`	`48`	`}`
Original file line number	Diff line number	Diff line change
`@@ -38,7 +38,7 @@ internal static double ContrastRatio(this Color color1, Color color2)`
`38`	`38`	`double darker = Math.Min(luminance1, luminance2);`
`39`	`39`
`40`	`40`	`// Calculate contrast ratio`
`41`		`- return (lighter + 0.05f) / (darker + 0.05f);`
	`41`	`+ return (lighter + 0.05) / (darker + 0.05);`
`42`	`42`	`}`
`43`	`43`
`44`	`44`	`internal static double PerceivedLuminance(this Color color)`