Remove automatic value change when specifying luminosity opacity on A…

…crylicBrush (#2017) * Add test page * Update test page to be better to use * Remove clamping of values with luminosity opacity set, update test page * Move code to else case * CR feedback
microsoft · Mar 18, 2020 · 4409667 · 4409667
1 parent 015cc8e
commit 4409667
Show file tree

Hide file tree

Showing 6 changed files with 125 additions and 21 deletions.
diff --git a/dev/Materials/Acrylic/AcrylicBrush.cpp b/dev/Materials/Acrylic/AcrylicBrush.cpp
@@ -333,10 +333,18 @@ winrt::Color AcrylicBrush::GetEffectiveTintColor()
 {
     winrt::Color tintColor = TintColor();
     double tintOpacity = TintOpacity();
-    double tintOpacityModifier = GetTintOpacityModifier(tintColor);
 
     // Update tintColor's alpha with the combined opacity value
-    tintColor.A = static_cast<uint8_t>(round(tintColor.A * tintOpacity * tintOpacityModifier));
+    // If LuminosityOpacity was specified, we don't intervene into users parameters
+    if (TintLuminosityOpacity() != nullptr)
+    {
+        tintColor.A = static_cast<uint8_t>(round(tintColor.A * tintOpacity));
+    }
+    else
+    {
+        double tintOpacityModifier = GetTintOpacityModifier(tintColor);
+        tintColor.A = static_cast<uint8_t>(round(tintColor.A * tintOpacity * tintOpacityModifier));
+    }
 
     return tintColor;
 }
@@ -419,39 +427,39 @@ winrt::Color AcrylicBrush::GetEffectiveLuminosityColor()
 // The tintColor passed into this method should be the original, unmodified color created using user values for TintColor + TintOpacity
 winrt::Color GetLuminosityColor(winrt::Color tintColor, winrt::IReference<double> luminosityOpacity)
 {
-    // To create the Luminosity blend input color, we're taking the TintColor input, converting to HSV, and clamping the V between these values
-    const double minHsvV = 0.125;
-    const double maxHsvV = 0.965;
-
     Rgb rgbTintColor = RgbFromColor(tintColor);
-    Hsv hsvTintColor = RgbToHsv(rgbTintColor);
 
-    auto clampedHsvV = std::clamp(hsvTintColor.v, minHsvV, maxHsvV);
+    // If luminosity opacity is specified, just use the values as is
+    if (luminosityOpacity != nullptr)
+    {
+        return ColorFromRgba(rgbTintColor, std::clamp(luminosityOpacity.GetDouble(), 0.0, 1.0));
+    }
+    else
+    {
+        // To create the Luminosity blend input color without luminosity opacity,
+        // we're taking the TintColor input, converting to HSV, and clamping the V between these values
+        const double minHsvV = 0.125;
+        const double maxHsvV = 0.965;
 
-    Hsv hsvLuminosityColor = Hsv(hsvTintColor.h, hsvTintColor.s, clampedHsvV);
-    Rgb rgbLuminosityColor = HsvToRgb(hsvLuminosityColor);
+        Hsv hsvTintColor = RgbToHsv(rgbTintColor);
 
-    double effectiveLuminosityOpacity = 0;
+        auto clampedHsvV = std::clamp(hsvTintColor.v, minHsvV, maxHsvV);
 
-    // Now figure out luminosity opacity
-    if (luminosityOpacity == nullptr)
-    {
+        Hsv hsvLuminosityColor = Hsv(hsvTintColor.h, hsvTintColor.s, clampedHsvV);
+        Rgb rgbLuminosityColor = HsvToRgb(hsvLuminosityColor);
+
+        // Now figure out luminosity opacity
         // Map original *tint* opacity to this range
         const double minLuminosityOpacity = 0.15;
         const double maxLuminosityOpacity = 1.03;
 
         double luminosityOpacityRangeMax = maxLuminosityOpacity - minLuminosityOpacity;
         double mappedTintOpacity = ((tintColor.A / 255.0) * luminosityOpacityRangeMax) + minLuminosityOpacity;
 
-        effectiveLuminosityOpacity = std::min(mappedTintOpacity, 1.0);
-    }
-    else
-    {
-        effectiveLuminosityOpacity = std::clamp(luminosityOpacity.GetDouble(), 0.0, 1.0);
+        // Finally, combine the luminosity opacity and the HsvV-clamped tint color
+        return ColorFromRgba(rgbLuminosityColor, std::min(mappedTintOpacity, 1.0));
     }
 
-    // Finally, combine the luminosity opacity and the HsvV-clamped tint color
-    return ColorFromRgba(rgbLuminosityColor, effectiveLuminosityOpacity);
 }
 
 void AcrylicBrush::EnsureNoiseBrush()

diff --git a/dev/Materials/Acrylic/TestUI/AcrylicBrushLuminosityTestPage.xaml b/dev/Materials/Acrylic/TestUI/AcrylicBrushLuminosityTestPage.xaml
@@ -0,0 +1,62 @@
+<local:TestPage
+    x:Class="MUXControlsTestApp.AcrylicBrushLuminosityTestPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:MUXControlsTestApp"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    xmlns:muxc="using:Microsoft.UI.Xaml.Media"
+    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+
+    <local:TestPage.Resources>
+            <muxc:AcrylicBrush x:Key="AcrylicBlackNoLuminosityOpacity" BackgroundSource="Backdrop"
+                TintOpacity="0.2" TintColor="#000000" FallbackColor="#FF008000" />
+            <muxc:AcrylicBrush x:Key="AcrylicDarkGreyNoLuminosityOpacity" BackgroundSource="Backdrop"
+                TintOpacity="0.2" TintColor="#1F1F1F" FallbackColor="#FF008000" />
+
+            <muxc:AcrylicBrush x:Key="AcrylicBlackWithLuminosityOpacity" BackgroundSource="Backdrop"
+                TintOpacity="0.2" TintColor="#000000" FallbackColor="#FF008000" />
+            <muxc:AcrylicBrush x:Key="AcrylicDarkGreyWithLuminosityOpacity" BackgroundSource="Backdrop"
+                TintOpacity="0.2" TintColor="#1F1F1F" FallbackColor="#FF008000" />
+    </local:TestPage.Resources>
+
+    <Grid MaxWidth="600" MaxHeight="600">
+        <Image x:Name="BackgroundPanel" Source="ms-appx:///Assets/SMPTE_WallpaperHD.png"
+                Stretch="Fill"/>
+
+        <StackPanel Orientation="Horizontal">
+            <StackPanel Margin="10,0,10,10">
+                <TextBlock Text="LuminosityOpacity not set
+                           (should look the same)"
+                    TextWrapping="WrapWholeWords" Foreground="Black" MaxWidth="170"/>
+
+                <TextBlock Text="Black" Foreground="Black" Margin="0,5,0,0"/>
+                <Rectangle x:Name="Rectangle1" Width="150" Height="150"
+                    Fill="{ThemeResource AcrylicBlackNoLuminosityOpacity}" HorizontalAlignment="Left" VerticalAlignment="Center">
+                </Rectangle>
+                <Rectangle x:Name="Rectangle2" Width="150" Height="150"
+                    Fill="{ThemeResource AcrylicDarkGreyNoLuminosityOpacity}" HorizontalAlignment="Left" VerticalAlignment="Center">
+                </Rectangle>
+                <TextBlock Text="Grey" Foreground="Black"/>
+            </StackPanel>
+
+            <StackPanel Margin="0,0,10,10">
+                <TextBlock Text="LuminosityOpacity set
+                           (should look different)"
+                    TextWrapping="WrapWholeWords" Foreground="Black" MaxWidth="150"/>
+
+                <TextBlock Text="Black" Foreground="Black" Margin="0,5,0,0"/>
+                <Rectangle x:Name="Rectangle3" Width="150" Height="150"
+                    Fill="{ThemeResource AcrylicBlackWithLuminosityOpacity}" HorizontalAlignment="Center" VerticalAlignment="Center">
+                </Rectangle>
+
+                <Rectangle x:Name="Rectangle4" Width="150" Height="150"
+                    Fill="{ThemeResource AcrylicDarkGreyWithLuminosityOpacity}" HorizontalAlignment="Center" VerticalAlignment="Center">
+                </Rectangle>
+                <TextBlock Text="Grey" Foreground="Black"/>
+            </StackPanel>
+        </StackPanel>
+
+    </Grid>
+</local:TestPage>
diff --git a/dev/Materials/Acrylic/TestUI/AcrylicBrushLuminosityTestPage.xaml.cs b/dev/Materials/Acrylic/TestUI/AcrylicBrushLuminosityTestPage.xaml.cs
@@ -0,0 +1,25 @@
+using Microsoft.UI.Xaml.Media;
+using Windows.Foundation.Metadata;
+
+// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=234238
+
+namespace MUXControlsTestApp
+{
+    /// <summary>
+    /// An empty page that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class AcrylicBrushLuminosityTestPage : TestPage
+    {
+        public AcrylicBrushLuminosityTestPage()
+        {
+            this.InitializeComponent();
+
+            // Tint luminosity opacity is only available in contract 8 and above
+            if (ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 8))
+            {
+                ((AcrylicBrush)Resources["AcrylicBlackWithLuminosityOpacity"]).TintLuminosityOpacity = 0.2;
+                ((AcrylicBrush)Resources["AcrylicDarkGreyWithLuminosityOpacity"]).TintLuminosityOpacity = 0.2;
+            }
+        }
+    }
+}
diff --git a/dev/Materials/Acrylic/TestUI/AcrylicBrush_TestUI.projitems b/dev/Materials/Acrylic/TestUI/AcrylicBrush_TestUI.projitems
@@ -10,6 +10,10 @@
     <Import_RootNamespace>AcrylicBrush_TestUI</Import_RootNamespace>
   </PropertyGroup>
   <ItemGroup>
+    <Page Include="$(MSBuildThisFileDirectory)AcrylicBrushLuminosityTestPage.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="$(MSBuildThisFileDirectory)AcrylicBrushPage.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -32,6 +36,9 @@
     </Page>
   </ItemGroup>
   <ItemGroup>
+    <Compile Include="$(MSBuildThisFileDirectory)AcrylicBrushLuminosityTestPage.xaml.cs">
+      <DependentUpon>AcrylicBrushLuminosityTestPage.xaml</DependentUpon>
+    </Compile>
     <Compile Include="$(MSBuildThisFileDirectory)AcrylicBrushPage.xaml.cs">
       <DependentUpon>AcrylicBrushPage.xaml</DependentUpon>
     </Compile>

diff --git a/dev/Materials/Acrylic/TestUI/AcrylicPage.xaml b/dev/Materials/Acrylic/TestUI/AcrylicPage.xaml
@@ -13,5 +13,6 @@
         <Button x:Name="navigateToColorAcrylic" AutomationProperties.Name="navigateToColorAcrylic" Margin="2" HorizontalAlignment="Stretch">Color Acrylic Tests</Button>
         <Button x:Name="navigateToMarkupAcrylic" AutomationProperties.Name="navigateToMarkupAcrylic" Margin="2" HorizontalAlignment="Stretch">Markup Acrylic Tests</Button>
         <Button x:Name="navigateToRenderingAcrylic" AutomationProperties.Name="navigateToRenderingAcrylic" Margin="2" HorizontalAlignment="Stretch">Rendering Acrylic Tests</Button>
+        <Button x:Name="navigateToLuminosityAcrylicTest" AutomationProperties.Name="LuminosityAcrylicTest" Margin="2" HorizontalAlignment="Stretch">Luminosity Acrylic Tests</Button>
     </StackPanel>
 </local:TestPage>
diff --git a/dev/Materials/Acrylic/TestUI/AcrylicPage.xaml.cs b/dev/Materials/Acrylic/TestUI/AcrylicPage.xaml.cs
@@ -30,6 +30,7 @@ public AcrylicPage()
             navigateToColorAcrylic.Click += delegate { Frame.NavigateWithoutAnimation(typeof(AcrylicColorPage), 0); };
             navigateToMarkupAcrylic.Click += delegate { Frame.NavigateWithoutAnimation(typeof(AcrylicMarkupPage), 0); };
             navigateToRenderingAcrylic.Click += delegate { Frame.NavigateWithoutAnimation(typeof(AcrylicRenderingPage), 0); };
+            navigateToLuminosityAcrylicTest.Click += delegate { Frame.NavigateWithoutAnimation(typeof(AcrylicBrushLuminosityTestPage), 0); };
         }
     }
 }