Change text contrast according to background

AmitJayant · Apr 5, 2016 · ed04a8c · ed04a8c
1 parent d22cc90
commit ed04a8c
Show file tree

Hide file tree

Showing 9 changed files with 95 additions and 177 deletions.
diff --git a/MaterialColors/About.xaml b/MaterialColors/About.xaml
@@ -5,13 +5,12 @@
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:local="clr-namespace:MaterialColors"
         mc:Ignorable="d"
-        Title="About Material Colors" Height="300" Width="350" WindowStartupLocation="CenterOwner" ResizeMode="NoResize"
-        Background="#616161" Icon="Material Colors.ico">
+        Title="About Material Colors" Height="300" Width="350" WindowStartupLocation="CenterOwner" ResizeMode="NoResize" Background="WhiteSmoke" Icon="Resources/icon.ico">
     <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
-        <Image Source="Material Colors.ico" Width="48" Height="48"/>
-        <TextBlock Foreground="White" FontSize="11" Text="Version 1.0" HorizontalAlignment="Center"/>
-        <TextBlock Tag="0" Foreground="White" FontSize="11" Text="by Amit Jayant" HorizontalAlignment="Center" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
-        <TextBlock Tag="1" Foreground="White" FontSize="11" Text="Source Code on Github" HorizontalAlignment="Center" Margin="0,16,0,0" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
-        <TextBlock Tag="2" Foreground="White" FontSize="11" Text="Design inpired by Roman Nurik's Material Colors App for Mac" Margin="0,16,0,0" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
+        <Image Source="/Resources/MaterialColors.png" Width="128" Height="128"/>
+        <TextBlock FontSize="11" Text="Version 1.0.1" HorizontalAlignment="Center"/>
+        <TextBlock Tag="0" FontSize="11" Text="by Amit Jayant" HorizontalAlignment="Center" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
+        <TextBlock Tag="1" FontSize="11" Text="Source Code on Github" HorizontalAlignment="Center" Margin="0,16,0,0" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
+        <TextBlock Tag="2" FontSize="11" Text="Design inpired by Roman Nurik's Material Colors App for Mac" Margin="0,16,0,0" MouseDown="TextBlock_MouseDown" Cursor="Hand"/>
     </StackPanel>
 </Window>
diff --git a/MaterialColors/MainWindow.xaml b/MaterialColors/MainWindow.xaml
diff --git a/MaterialColors/MainWindow.xaml.cs b/MaterialColors/MainWindow.xaml.cs
@@ -13,7 +13,7 @@ public partial class MainWindow : Window
     {
         Grid grid;
         Rectangle rectangle;
-        Label labelHex;
+        Label labelColorNum, labelHex;
 
         public MainWindow()
         {
@@ -95,11 +95,29 @@ private void setupColorPalette(Button btn)
                 colorHex = MaterialColorsEngine.getMaterialColor(btn.Tag, i);
                 grid = (Grid)VisualTreeHelper.GetChild(swatchesButton[i], 0);
                 rectangle = (Rectangle)VisualTreeHelper.GetChild(grid, 0);
+                labelColorNum = (Label)VisualTreeHelper.GetChild(grid, 1);
                 labelHex = (Label)VisualTreeHelper.GetChild(grid, 2);
 
-                rectangle.Fill = new SolidColorBrush((Color)ColorConverter.ConvertFromString(colorHex));
+                // Set content
                 labelHex.Content = colorHex;
+
+                // Calculate readable color value
+                Color backColor = (Color)ColorConverter.ConvertFromString(colorHex);
+                Color foreColor = (perceivedBrightness(backColor) > 130 ? Colors.Black : Colors.White);
+
+                // Set colors
+                rectangle.Fill = new SolidColorBrush((Color)ColorConverter.ConvertFromString(colorHex));
+                labelColorNum.Foreground = new SolidColorBrush(foreColor);
+                labelHex.Foreground = new SolidColorBrush(foreColor);
             }
         }
+
+        private int perceivedBrightness(Color c)
+        {
+            return (int)Math.Sqrt(
+            c.R * c.R * .299 +
+            c.G * c.G * .587 +
+            c.B * c.B * .114);
+        }
     }
 }
diff --git a/MaterialColors/Material Colors.csproj b/MaterialColors/Material Colors.csproj
@@ -51,7 +51,7 @@
     <WarningLevel>4</WarningLevel>
   </PropertyGroup>
   <PropertyGroup>
-    <ApplicationIcon>Material Colors.ico</ApplicationIcon>
+    <ApplicationIcon>Resources\icon.ico</ApplicationIcon>
   </PropertyGroup>
   <PropertyGroup>
     <ManifestCertificateThumbprint>B04817B4E13890561092833B9D24B28F6E1A12EE</ManifestCertificateThumbprint>
@@ -125,6 +125,7 @@
     <EmbeddedResource Include="Properties\Resources.resx">
       <Generator>ResXFileCodeGenerator</Generator>
       <LastGenOutput>Resources.Designer.cs</LastGenOutput>
+      <SubType>Designer</SubType>
     </EmbeddedResource>
     <None Include="MaterialColors_TemporaryKey.pfx" />
     <None Include="Properties\Settings.settings">
@@ -136,9 +137,6 @@
   <ItemGroup>
     <None Include="App.config" />
   </ItemGroup>
-  <ItemGroup>
-    <Resource Include="Material Colors.ico" />
-  </ItemGroup>
   <ItemGroup>
     <BootstrapperPackage Include=".NETFramework,Version=v4.5.2">
       <Visible>False</Visible>
@@ -152,7 +150,10 @@
     </BootstrapperPackage>
   </ItemGroup>
   <ItemGroup>
-    <Resource Include="Resources\close.png" />
+    <Resource Include="Resources\icon.ico" />
+  </ItemGroup>
+  <ItemGroup>
+    <Resource Include="Resources\MaterialColors.png" />
   </ItemGroup>
   <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
   <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 

diff --git a/MaterialColors/Properties/Resources.Designer.cs b/MaterialColors/Properties/Resources.Designer.cs
diff --git a/MaterialColors/Properties/Resources.resx b/MaterialColors/Properties/Resources.resx
@@ -118,7 +118,10 @@
     <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
   </resheader>
   <assembly alias="System.Windows.Forms" name="System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" />
-  <data name="close" type="System.Resources.ResXFileRef, System.Windows.Forms">
-    <value>..\Resources\close.png;System.Drawing.Bitmap, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a</value>
+  <data name="icon" type="System.Resources.ResXFileRef, System.Windows.Forms">
+    <value>..\Resources\icon.ico;System.Drawing.Icon, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a</value>
+  </data>
+  <data name="MaterialColors" type="System.Resources.ResXFileRef, System.Windows.Forms">
+    <value>..\Resources\MaterialColors.png;System.Drawing.Bitmap, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a</value>
   </data>
 </root>
diff --git a/MaterialColors/Resources/MaterialColors.png b/MaterialColors/Resources/MaterialColors.png
diff --git a/MaterialColors/Resources/close.png b/MaterialColors/Resources/close.png
diff --git a/MaterialColors/Material Colors.ico → MaterialColors/Resources/icon.ico b/MaterialColors/Material Colors.ico → MaterialColors/Resources/icon.ico