DevWiki/calculator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update KGF Back Button Styling (#927)

Browse Source 
* Remove rounded corners on the back button

* Updated back button style to align with Equation button.

* Fixed issue where the forground color was white in high contrast and fixed the crash in high contrast
This commit is contained in:
Stephanie Anderl 2020-01-13 15:09:45 -08:00 committed by GitHub
parent ff2a94f64d
commit 9fc9c97ee7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 75 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
src/Calculator/Views/GraphingCalculator/KeyGraphFeaturesPanel.xaml
View File

@ -1,6 +1,7 @@
<UserControl x:Class="CalculatorApp.KeyGraphFeaturesPanel" <UserControl x:Class="CalculatorApp.KeyGraphFeaturesPanel"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:contract7Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,7)"
xmlns:controls="using:CalculatorApp.Controls" xmlns:controls="using:CalculatorApp.Controls"
xmlns:converters="using:CalculatorApp.Converters" xmlns:converters="using:CalculatorApp.Converters"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
@ -17,14 +18,86 @@
<!-- Can't be #ffffff due to a bug in RichEditBox considering it as the default value --> <!-- Can't be #ffffff due to a bug in RichEditBox considering it as the default value -->
<!-- and replacing it by the system value (#000000) when dark theme is used --> <!-- and replacing it by the system value (#000000) when dark theme is used -->
<SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="#feffff"/> <SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="#feffff"/>
<x:Double x:Key="EquationButtonOverlayPointerOverOpacity">0.3</x:Double>
<x:Double x:Key="EquationButtonOverlayPressedOpacity">0.5</x:Double>
<SolidColorBrush x:Key="EquationButtonOverlayBackgroundBrush" Color="White"/>
<Style x:Key="ThemedBackButtonStyle"
BasedOn="{StaticResource BackButtonStyle}"
TargetType="Button"/>
</ResourceDictionary> </ResourceDictionary>
<ResourceDictionary x:Key="Light"> <ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="Black"/> <SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="Black"/>
<x:Double x:Key="EquationButtonOverlayPointerOverOpacity">0.2</x:Double>
<x:Double x:Key="EquationButtonOverlayPressedOpacity">0.4</x:Double>
<SolidColorBrush x:Key="EquationButtonOverlayBackgroundBrush" Color="Black"/>
<Style x:Key="ThemedBackButtonStyle"
BasedOn="{StaticResource BackButtonStyle}"
TargetType="Button"/>
</ResourceDictionary> </ResourceDictionary>
<ResourceDictionary x:Key="HighContrast"> <ResourceDictionary x:Key="HighContrast">
<SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="{ThemeResource SystemColorWindowTextColor}"/> <SolidColorBrush x:Key="TitleMathRichEditBoxForegroundBrush" Color="{ThemeResource SystemColorWindowTextColor}"/>
<x:Double x:Key="EquationButtonOverlayPointerOverOpacity">0</x:Double>
<x:Double x:Key="EquationButtonOverlayPressedOpacity">0</x:Double>
<SolidColorBrush x:Key="EquationButtonOverlayBackgroundBrush" Color="Transparent"/>
<Style x:Key="ThemedBackButtonStyle" TargetType="Button"/>
</ResourceDictionary> </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries> </ResourceDictionary.ThemeDictionaries>
<!-- EquationButtonBackgroundBrush is only used in Dark and Light theme. -->
<!-- The x:Name property is required for High Contrast theme so the brush is indexed properly. -->
<SolidColorBrush x:Key="EquationButtonBackgroundBrush"
x:Name="EquationButtonBackgroundBrush"
Color="{x:Bind ViewModel.LineColor, Mode=OneWay}"/>
<Style x:Key="BackButtonStyle" TargetType="Button">
<Setter Property="Background" Value="{ThemeResource EquationButtonBackgroundBrush}"/>
<Setter Property="Foreground" Value="{ThemeResource SystemChromeWhiteColor}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid x:Name="RootGrid"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
CornerRadius="{TemplateBinding CornerRadius}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Target="Overlay.Opacity" Value="0.0"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="PointerOver">
<VisualState.Setters>
<Setter Target="Overlay.Opacity" Value="{StaticResource EquationButtonOverlayPointerOverOpacity}"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Pressed">
<VisualState.Setters>
<Setter Target="Overlay.Opacity" Value="{StaticResource EquationButtonOverlayPressedOpacity}"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Rectangle x:Name="Overlay"
Fill="{ThemeResource EquationButtonOverlayBackgroundBrush}"
Opacity="0"
IsHitTestVisible="False"/>
<ContentPresenter x:Name="ContentPresenter"
Padding="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
AutomationProperties.AccessibilityView="Raw"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
ContentTransitions="{TemplateBinding ContentTransitions}"
CornerRadius="{TemplateBinding CornerRadius}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="KGF_RichEditBoxStyle" TargetType="controls:MathRichEditBox"> <Style x:Key="KGF_RichEditBoxStyle" TargetType="controls:MathRichEditBox">
<Setter Property="FontSize" Value="14"/> <Setter Property="FontSize" Value="14"/>
<Setter Property="IsReadOnly" Value="True"/> <Setter Property="IsReadOnly" Value="True"/>
@ -56,7 +129,6 @@
</Setter> </Setter>
</Style> </Style>
<Style x:Name="KGF_TitleTextBlockStyle" TargetType="TextBlock"> <Style x:Name="KGF_TitleTextBlockStyle" TargetType="TextBlock">
<Setter Property="FontWeight" Value="Medium"/> <Setter Property="FontWeight" Value="Medium"/>
<Setter Property="FontSize" Value="16"/> <Setter Property="FontSize" Value="16"/>
@ -161,9 +233,8 @@
x:Uid="equationAnalysisBack" x:Uid="equationAnalysisBack"
MinWidth="44" MinWidth="44"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
Style="{StaticResource ButtonRevealStyle}" Style="{ThemeResource ThemedBackButtonStyle}"
Background="{x:Bind local:KeyGraphFeaturesPanel.ToSolidColorBrush(ViewModel.LineColor), Mode=OneWay}" contract7Present:CornerRadius="0"
Foreground="{ThemeResource SystemChromeWhiteColor}"
Click="BackButton_Click"> Click="BackButton_Click">
<StackPanel Margin="5,0" <StackPanel Margin="5,0"
HorizontalAlignment="Center" HorizontalAlignment="Center"