Update Calculator keyboard for greater consistency and extensibility (#688)

src/Calculator/Views/Calculator.xaml.h

@@ -11,6 +11,8 @@
 #include "Controls/CalculatorButton.h"
 #include "Controls/CalculationResult.h"
 #include "Controls/OverflowTextBlock.h"
+#include "Controls/OperatorPanelListView.h"
+#include "Controls/OperatorPanelButton.h"
 #include "CalcViewModel/HistoryViewModel.h"
 #include "Views/CalculatorProgrammerDisplayPanel.xaml.h"
 #include "Views/CalculatorProgrammerOperators.xaml.h"
@@ -18,6 +20,7 @@
 #include "Views/HistoryList.xaml.h"
 #include "Views/Memory.xaml.h"
 #include "Views/OperatorsPanel.xaml.h"
+#include "Views/StateTriggers/ControlSizeTrigger.h"
 
 namespace CalculatorApp
 {

src/Calculator/Views/CalculatorProgrammerRadixOperators.xaml

@@ -1,18 +1,28 @@
 <UserControl x:Class="CalculatorApp.CalculatorProgrammerRadixOperators"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:Windows10version1803="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract, 7)"
+             xmlns:Windows10version1809="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract, 7)"
              xmlns:common="using:CalculatorApp.Common"
              xmlns:controls="using:CalculatorApp.Controls"
+             xmlns:converters="using:CalculatorApp.Converters"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:local="using:CalculatorApp"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:triggers="using:CalculatorApp.Views.StateTriggers"
              x:Name="ControlRoot"
              d:DesignHeight="395"
              d:DesignWidth="315"
+             XYFocusKeyboardNavigation="Enabled"
              mc:Ignorable="d">
+    <UserControl.Resources>
+        <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
+        <converters:BooleanToVisibilityNegationConverter x:Key="BooleanToVisibilityNegationConverter"/>
+    </UserControl.Resources>
 
     <Grid x:Name="ProgRadixOps">
         <Grid.RowDefinitions>
+            <RowDefinition x:Name="OperatorPanelRow" Height="Auto"/>
             <RowDefinition Height="1*"/>
             <RowDefinition Height="1*"/>
             <RowDefinition Height="1*"/>
@@ -27,7 +37,6 @@
             <ColumnDefinition x:Name="C2" Width="1*"/>
             <ColumnDefinition x:Name="C3" Width="1*"/>
             <ColumnDefinition x:Name="C4" Width="1*"/>
-            <ColumnDefinition x:Name="C5" Width="1*"/>
             <ColumnDefinition x:Name="GutterRight" Width="0"/>
         </Grid.ColumnDefinitions>
 
@@ -45,7 +54,6 @@
                         <Setter Target="NotButton.IsEnabled" Value="False"/>
                         <Setter Target="AndButton.IsEnabled" Value="False"/>
 
-                        <Setter Target="ShiftButton.IsEnabled" Value="False"/>
                         <Setter Target="ModButton.IsEnabled" Value="False"/>
 
                         <Setter Target="DivideButton.IsEnabled" Value="False"/>
@@ -56,180 +64,489 @@
                         <Setter Target="OpenParenthesisButton.IsEnabled" Value="False"/>
                         <Setter Target="CloseParenthesisButton.IsEnabled" Value="False"/>
                         <Setter Target="NegateButton.IsEnabled" Value="False"/>
+                        <Setter Target="BitShiftButton.IsEnabled" Value="False"/>
+                        <Setter Target="BitwiseButton.IsEnabled" Value="False"/>
                     </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
             <VisualStateGroup>
-                <VisualState x:Name="Portrait768x1366">
+                <VisualState x:Name="Large">
                     <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="1366" MinWindowWidth="768"/>
+                        <triggers:ControlSizeTrigger MinWidth="1053"
+                                                     MinHeight="729"
+                                                     Source="{x:Bind ProgRadixOps}"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="AButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="BButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="CButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="DButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="EButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+                        <Setter Target="FButton.Style" Value="{StaticResource NumericButtonStyle38}"/>
+
+                        <Setter Target="ModButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="OpenParenthesisButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="CloseParenthesisButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+
+                        <Setter Target="AndButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="OrButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="XorButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="NandButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="NorButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RolButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RorButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RolCarryButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RorCarryButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="LshButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RshButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="LshLogicalButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="RshLogicalButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="NotButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+
+                        <Setter Target="OperatorPanelRow.MinHeight" Value="{StaticResource OperatorPanelButtonRowSizeLarge}"/>
+
+                        <Setter Target="BitwiseButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeLarge}"/>
+                        <Setter Target="BitwiseButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeLarge}"/>
+                        <Setter Target="BitwiseButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeLarge}"/>
+
+                        <Setter Target="BitShiftButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeLarge}"/>
+                        <Setter Target="BitShiftButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeLarge}"/>
+                        <Setter Target="BitShiftButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeLarge}"/>
+
+                        <Setter Target="BitwiseGrid.MinWidth" Value="387"/>
+                        <Setter Target="BitwiseGrid.MinHeight" Value="192"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="Medium">
+                    <VisualState.StateTriggers>
+                        <triggers:ControlSizeTrigger MinWidth="630"
+                                                     MinHeight="437"
+                                                     Source="{x:Bind ProgRadixOps}"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="AButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="BButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="CButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="DButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="EButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+                        <Setter Target="FButton.Style" Value="{StaticResource NumericButtonStyle24}"/>
+
+                        <Setter Target="ModButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
+                        <Setter Target="OpenParenthesisButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="CloseParenthesisButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+
+                        <Setter Target="AndButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="OrButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="XorButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="NandButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="NorButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RolButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RorButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RolCarryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RorCarryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="LshButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RshButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="LshLogicalButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="RshLogicalButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="NotButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+
+                        <Setter Target="OperatorPanelRow.MinHeight" Value="{StaticResource OperatorPanelButtonRowSizeMedium}"/>
+
+                        <Setter Target="BitwiseButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeMedium}"/>
+                        <Setter Target="BitwiseButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeMedium}"/>
+                        <Setter Target="BitwiseButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeMedium}"/>
+
+                        <Setter Target="BitShiftButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeMedium}"/>
+                        <Setter Target="BitShiftButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeMedium}"/>
+                        <Setter Target="BitShiftButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeMedium}"/>
+
+                        <Setter Target="BitwiseGrid.MinWidth" Value="416"/>
+                        <Setter Target="BitwiseGrid.MinHeight" Value="144"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="Small">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="{StaticResource AppMinWindowHeight}" MinWindowWidth="{StaticResource AppMinWindowWidth}"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle18}"/>
+                        <Setter Target="AButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+                        <Setter Target="BButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+                        <Setter Target="CButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+                        <Setter Target="DButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+                        <Setter Target="EButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+                        <Setter Target="FButton.Style" Value="{StaticResource NumericButtonStyle14}"/>
+
+                        <Setter Target="ModButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
                         <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
                         <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
                         <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
                         <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
                         <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="OpenParenthesisButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="CloseParenthesisButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
 
-                        <Setter Target="AButton.FontSize" Value="{StaticResource TitleFontSize}"/>
-                        <Setter Target="BButton.FontSize" Value="{StaticResource TitleFontSize}"/>
-                        <Setter Target="CButton.FontSize" Value="{StaticResource TitleFontSize}"/>
-                        <Setter Target="DButton.FontSize" Value="{StaticResource TitleFontSize}"/>
-                        <Setter Target="EButton.FontSize" Value="{StaticResource TitleFontSize}"/>
-                        <Setter Target="FButton.FontSize" Value="{StaticResource TitleFontSize}"/>
+                        <Setter Target="AndButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="OrButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="XorButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NandButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NorButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RolButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RorButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RolCarryButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RorCarryButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="LshButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RshButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="LshLogicalButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="RshLogicalButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NotButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
 
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle24}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="FullLayout">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="768" MinWindowWidth="1024"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle24}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="MinSizeLayout">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="{StaticResource AppMinWindowHeight}" MinWindowWidth="{StaticResource AppMinWindowWidth}"/>
-                    </VisualState.StateTriggers>
-                </VisualState>
-                <VisualState x:Name="DefaultLayout">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="OpenParenthesisButton.FontSize" Value="12"/>
-                        <Setter Target="OpenParenthesisButton.Padding" Value="0"/>
-                        <Setter Target="CloseParenthesisButton.FontSize" Value="12"/>
-                        <Setter Target="CloseParenthesisButton.Padding" Value="0"/>
+                        <Setter Target="OperatorPanelRow.MinHeight" Value="{StaticResource OperatorPanelButtonRowSizeSmall}"/>
 
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="AButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="BButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="CButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="DButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="EButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
-                        <Setter Target="FButton.Style" Value="{StaticResource NumericButtonStyle12}"/>
+                        <Setter Target="BitwiseButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeSmall}"/>
+                        <Setter Target="BitwiseButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeSmall}"/>
+                        <Setter Target="BitwiseButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeSmall}"/>
 
-                        <Setter Target="ShiftButton.Style" Value="{StaticResource CaptionToggleButtonSmallStyle}"/>
+                        <Setter Target="BitShiftButton.ChevronFontSize" Value="{ThemeResource OperatorPanelChevronFontSizeSmall}"/>
+                        <Setter Target="BitShiftButton.GlyphFontSize" Value="{ThemeResource OperatorPanelGlyphFontSizeSmall}"/>
+                        <Setter Target="BitShiftButton.FontSize" Value="{ThemeResource OperatorPanelFontSizeSmall}"/>
+
+                        <Setter Target="BitwiseGrid.MinWidth" Value="194"/>
+                        <Setter Target="BitwiseGrid.MinHeight" Value="96"/>
                     </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
 
+        <controls:OperatorPanelListView x:Uid="ProgrammerOperatorPanel"
+                                        Grid.ColumnSpan="6"
+                                        Background="{ThemeResource AppOperatorPanelBackground}"
+                                        AutomationProperties.HeadingLevel="Level1">
+
+            <controls:OperatorPanelButton x:Name="BitwiseButton"
+                                          x:Uid="bitwiseButton"
+                                          Style="{StaticResource OperatorPanelButtonStyle}"
+                                          AutomationProperties.AutomationId="bitwiseButton"
+                                          Glyph="&#xF895;">
+                <controls:OperatorPanelButton.FlyoutMenu>
+                    <Flyout x:Name="BitwiseFlyout"
+                            Windows10version1803:Placement="Bottom"
+                            Windows10version1809:AreOpenCloseAnimationsEnabled="False"
+                            Windows10version1809:Placement="BottomEdgeAlignedLeft"
+                            FlyoutPresenterStyle="{ThemeResource OperatorPanelFlyoutStyle}">
+                        <Grid x:Name="BitwiseGrid"
+                              MinWidth="258"
+                              MinHeight="96"
+                              XYFocusKeyboardNavigation="Enabled">
+                            <Grid.RowDefinitions>
+                                <RowDefinition Height="1*"/>
+                                <RowDefinition Height="1*"/>
+                            </Grid.RowDefinitions>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="1*"/>
+                                <ColumnDefinition Width="1*"/>
+                                <ColumnDefinition Width="1*"/>
+                            </Grid.ColumnDefinitions>
+                            <!--
+                                Because of the way we handle keyboard shortcuts, the IsEnabled property must be bound to a button outside the flyout.
+                                This is because the content from within the Flyout do not inherit the IsEnabled property of the flyout parent,
+                                causing the shortcut keys to be used when the control would normally be disabled.
+                            -->
+                            <controls:CalculatorButton x:Name="AndButton"
+                                                       x:Uid="andButton"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="andButton"
+                                                       ButtonId="And"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="AND"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+
+                            <controls:CalculatorButton x:Name="OrButton"
+                                                       x:Uid="orButton"
+                                                       Grid.Column="1"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="orButton"
+                                                       ButtonId="Or"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="OR"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+
+                            <controls:CalculatorButton x:Name="NotButton"
+                                                       x:Uid="notButton"
+                                                       Grid.Column="2"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="notButton"
+                                                       ButtonId="Not"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="NOT"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+
+                            <controls:CalculatorButton x:Name="XorButton"
+                                                       x:Uid="xorButton"
+                                                       Grid.Row="1"
+                                                       Grid.Column="2"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="xorButton"
+                                                       ButtonId="Xor"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="XOR"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+
+                            <controls:CalculatorButton x:Name="NandButton"
+                                                       x:Uid="nandButton"
+                                                       Grid.Row="1"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="nandButton"
+                                                       ButtonId="Nand"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="NAND"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+
+                            <controls:CalculatorButton x:Name="NorButton"
+                                                       x:Uid="norButton"
+                                                       Grid.Row="1"
+                                                       Grid.Column="1"
+                                                       Style="{StaticResource OperatorButtonStyle}"
+                                                       FontSize="12"
+                                                       AutomationProperties.AutomationId="norButton"
+                                                       ButtonId="Nor"
+                                                       Click="FlyoutButton_Clicked"
+                                                       Command="{x:Bind Model.ButtonPressed}"
+                                                       Content="NOR"
+                                                       IsEnabled="{x:Bind BitwiseButton.IsEnabled, Mode=OneWay}"/>
+                        </Grid>
+                    </Flyout>
+                </controls:OperatorPanelButton.FlyoutMenu>
+            </controls:OperatorPanelButton>
+            <controls:OperatorPanelButton x:Name="BitShiftButton"
+                                          x:Uid="bitShiftButton"
+                                          Style="{StaticResource OperatorPanelButtonStyle}"
+                                          AutomationProperties.AutomationId="bitShiftButton"
+                                          Glyph="&#xE301;">
+                <controls:OperatorPanelButton.FlyoutMenu>
+                    <Flyout x:Name="BitShiftFlyout"
+                            Windows10version1809:AreOpenCloseAnimationsEnabled="False"
+                            FlyoutPresenterStyle="{ThemeResource OperatorPanelFlyoutStyle}"
+                            Placement="Bottom">
+                        <StackPanel MaxWidth="192" Padding="12">
+                            <RadioButton x:Name="ArithmeticShiftButton"
+                                         x:Uid="arithmeticShiftButton"
+                                         AutomationProperties.AutomationId="arithmeticShiftButton"
+                                         Checked="BitshiftFlyout_Checked"
+                                         IsChecked="True"/>
+                            <RadioButton x:Name="LogicalShiftButton"
+                                         x:Uid="logicalShiftButton"
+                                         AutomationProperties.AutomationId="logicalShiftButton"
+                                         Checked="BitshiftFlyout_Checked"/>
+                            <RadioButton x:Name="RotateCircularButton"
+                                         x:Uid="rotateCircularButton"
+                                         AutomationProperties.AutomationId="rotateCircularButton"
+                                         Checked="BitshiftFlyout_Checked"/>
+                            <RadioButton x:Name="RotateCarryShiftButton"
+                                         x:Uid="rotateCarryShiftButton"
+                                         AutomationProperties.AutomationId="rotateCarryShiftButton"
+                                         Checked="BitshiftFlyout_Checked"/>
+                        </StackPanel>
+                    </Flyout>
+                </controls:OperatorPanelButton.FlyoutMenu>
+            </controls:OperatorPanelButton>
+        </controls:OperatorPanelListView>
+
         <Grid x:Uid="ProgrammerOperators"
-              Grid.Column="1"
-              Grid.ColumnSpan="6"
+              Grid.Row="1"
+              Grid.Column="2"
+              Grid.ColumnSpan="2"
               AutomationProperties.HeadingLevel="Level1">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition/>
                 <ColumnDefinition/>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
             </Grid.ColumnDefinitions>
             <controls:CalculatorButton x:Name="RolButton"
                                        x:Uid="rolButton"
                                        Grid.Column="0"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        x:DeferLoadStrategy="Lazy"
                                        AutomationProperties.AutomationId="rolButton"
                                        ButtonId="Rol"
-                                       Content="RoL"
+                                       Content="&#xF88E;"
                                        Visibility="Collapsed"/>
             <controls:CalculatorButton x:Name="RorButton"
                                        x:Uid="rorButton"
                                        Grid.Column="1"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        x:DeferLoadStrategy="Lazy"
                                        AutomationProperties.AutomationId="rorButton"
                                        ButtonId="Ror"
-                                       Content="RoR"
+                                       Content="&#xF88F;"
                                        Visibility="Collapsed"/>
+
+            <controls:CalculatorButton x:Name="RolCarryButton"
+                                       x:Uid="rolCarryButton"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       FontSize="12"
+                                       x:DeferLoadStrategy="Lazy"
+                                       AutomationProperties.AutomationId="rolButton"
+                                       ButtonId="RolC"
+                                       Content="&#xF88E;"
+                                       Visibility="Collapsed"/>
+
+            <controls:CalculatorButton x:Name="RorCarryButton"
+                                       x:Uid="rorCarryButton"
+                                       Grid.Column="1"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       FontSize="12"
+                                       x:DeferLoadStrategy="Lazy"
+                                       AutomationProperties.AutomationId="rorCarryButton"
+                                       ButtonId="RorC"
+                                       Content="&#xF88F;"
+                                       Visibility="Collapsed"/>
+
             <controls:CalculatorButton x:Name="LshButton"
                                        x:Uid="lshButton"
-                                       Grid.Column="0"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="lshButton"
                                        ButtonId="Lsh"
-                                       Content="Lsh"/>
+                                       Content="&#xF88E;"/>
             <controls:CalculatorButton x:Name="RshButton"
                                        x:Uid="rshButton"
                                        Grid.Column="1"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="rshButton"
                                        ButtonId="Rsh"
-                                       Content="Rsh"/>
-            <controls:CalculatorButton x:Name="OrButton"
-                                       x:Uid="orButton"
-                                       Grid.Column="2"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       Content="&#xF88F;"/>
+
+            <controls:CalculatorButton x:Name="LshLogicalButton"
+                                       x:Uid="LshLogicalButton"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
-                                       AutomationProperties.AutomationId="orButton"
-                                       ButtonId="Or"
-                                       Content="Or"/>
-            <controls:CalculatorButton x:Name="XorButton"
-                                       x:Uid="xorButton"
-                                       Grid.Column="3"
-                                       Style="{StaticResource OperatorButtonStyle}"
+                                       x:DeferLoadStrategy="Lazy"
+                                       AutomationProperties.AutomationId="lshLogicalButton"
+                                       ButtonId="Lsh"
+                                       Content="&#xF88E;"
+                                       Visibility="Collapsed"/>
+            <controls:CalculatorButton x:Name="RshLogicalButton"
+                                       x:Uid="rshLogicalButton"
+                                       Grid.Column="1"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
-                                       AutomationProperties.AutomationId="xorButton"
-                                       ButtonId="Xor"
-                                       Content="Xor"/>
-            <controls:CalculatorButton x:Name="NotButton"
-                                       x:Uid="notButton"
-                                       Grid.Column="4"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="12"
-                                       AutomationProperties.AutomationId="notButton"
-                                       ButtonId="Not"
-                                       Content="Not"/>
-            <controls:CalculatorButton x:Name="AndButton"
-                                       x:Uid="andButton"
-                                       Grid.Column="5"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="12"
-                                       AutomationProperties.AutomationId="andButton"
-                                       ButtonId="And"
-                                       Content="And"/>
+                                       x:DeferLoadStrategy="Lazy"
+                                       AutomationProperties.AutomationId="rshLogicalButton"
+                                       ButtonId="RshL"
+                                       Content="&#xF88F;"
+                                       Visibility="Collapsed"/>
         </Grid>
 
-        <ToggleButton x:Name="ShiftButton"
-                      x:Uid="shiftButton"
-                      Grid.Row="1"
-                      Grid.Column="1"
-                      HorizontalAlignment="Stretch"
-                      VerticalAlignment="Stretch"
-                      Style="{StaticResource CaptionToggleButtonStyle}"
-                      FontFamily="{StaticResource CalculatorFontFamily}"
-                      FontSize="16"
-                      AutomationProperties.AutomationId="shiftButton"
-                      Checked="Shift_Clicked"
-                      Content="&#xF897;"
-                      Unchecked="Shift_Clicked"/>
+        <Grid x:Uid="DisplayControls"
+              Grid.Row="1"
+              Grid.Column="4"
+              Grid.ColumnSpan="2"
+              AutomationProperties.HeadingLevel="Level1">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition/>
+                <ColumnDefinition/>
+            </Grid.ColumnDefinitions>
+            <controls:CalculatorButton x:Name="ClearButton"
+                                       x:Uid="clearButton"
+                                       Style="{StaticResource OperatorButtonStyle}"
+                                       FontSize="12"
+                                       AutomationProperties.AutomationId="clearButton"
+                                       ButtonId="Clear"
+                                       Content="C"
+                                       Visibility="{x:Bind Model.IsInputEmpty, Mode=OneWay, Converter={StaticResource BooleanToVisibilityConverter}}"/>
+
+            <controls:CalculatorButton x:Name="ClearEntryButton"
+                                       x:Uid="clearEntryButton"
+                                       Style="{StaticResource OperatorButtonStyle}"
+                                       FontSize="12"
+                                       AutomationProperties.AutomationId="clearEntryButton"
+                                       ButtonId="ClearEntry"
+                                       Content="CE"
+                                       Visibility="{x:Bind Model.IsInputEmpty, Mode=OneWay, Converter={StaticResource BooleanToVisibilityNegationConverter}}"/>
+
+            <controls:CalculatorButton x:Name="BackSpaceButton"
+                                       x:Uid="backSpaceButton"
+                                       Grid.Column="1"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       FontSize="12"
+                                       AutomationProperties.AutomationId="backSpaceButton"
+                                       ButtonId="Backspace"
+                                       Content="&#xE94F;"/>
+        </Grid>
+
+        <controls:CalculatorButton x:Name="OpenParenthesisButton"
+                                   x:Uid="openParenthesisButton"
+                                   Grid.Row="2"
+                                   Grid.Column="2"
+                                   Style="{StaticResource ParenthesisCalcButtonStyle}"
+                                   FontSize="18"
+                                   AutomationProperties.AutomationId="openParenthesisButton"
+                                   ButtonId="OpenParenthesis"
+                                   Content="("
+                                   GotFocus="OpenParenthesisButton_GotFocus"
+                                   Tag="{x:Bind ParenthesisCountToString(Model.OpenParenthesisCount), Mode=OneWay}"/>
+
+        <controls:CalculatorButton x:Name="CloseParenthesisButton"
+                                   x:Uid="closeParenthesisButton"
+                                   Grid.Row="2"
+                                   Grid.Column="3"
+                                   Style="{StaticResource OperatorButtonStyle}"
+                                   FontSize="18"
+                                   AutomationProperties.AutomationId="closeParenthesisButton"
+                                   ButtonId="CloseParenthesis"
+                                   Content=")"/>
+
         <controls:CalculatorButton x:Name="ModButton"
                                    x:Uid="modButton"
-                                   Grid.Row="1"
-                                   Grid.Column="2"
+                                   Grid.Row="2"
+                                   Grid.Column="4"
                                    Style="{StaticResource OperatorButtonStyle}"
                                    FontSize="12"
                                    AutomationProperties.AutomationId="modButton"
                                    ButtonId="Mod"
-                                   Content="Mod"/>
+                                   Content="%"/>
 
         <Grid x:Uid="StandardOperators"
-              Grid.Row="1"
+              Grid.Row="2"
               Grid.RowSpan="5"
-              Grid.Column="6"
+              Grid.Column="5"
               AutomationProperties.HeadingLevel="Level1">
             <Grid.RowDefinitions>
                 <RowDefinition/>
@@ -241,86 +558,52 @@
             <controls:CalculatorButton x:Name="DivideButton"
                                        x:Uid="divideButton"
                                        Grid.Row="0"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="divideButton"
                                        ButtonId="Divide"
                                        Content="&#xE94A;"/>
+
             <controls:CalculatorButton x:Name="MultiplyButton"
                                        x:Uid="multiplyButton"
                                        Grid.Row="1"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="multiplyButton"
                                        ButtonId="Multiply"
                                        Content="&#xE947;"/>
+
             <controls:CalculatorButton x:Name="MinusButton"
                                        x:Uid="minusButton"
                                        Grid.Row="2"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="minusButton"
                                        ButtonId="Subtract"
                                        Content="&#xE949;"/>
+
             <controls:CalculatorButton x:Name="PlusButton"
                                        x:Uid="plusButton"
                                        Grid.Row="3"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="plusButton"
                                        ButtonId="Add"
                                        Content="&#xE948;"/>
+
             <controls:CalculatorButton x:Name="EqualButton"
                                        x:Uid="equalButton"
                                        Grid.Row="4"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource AccentEmphasizedCalcButtonStyle}"
                                        FontSize="12"
                                        AutomationProperties.AutomationId="equalButton"
                                        ButtonId="Equals"
                                        Content="&#xE94E;"/>
         </Grid>
 
-        <Grid x:Uid="DisplayControls"
-              Grid.Row="1"
-              Grid.Column="3"
-              Grid.ColumnSpan="3"
-              AutomationProperties.HeadingLevel="Level1">
-            <Grid.ColumnDefinitions>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-            </Grid.ColumnDefinitions>
-            <controls:CalculatorButton x:Name="ClearEntryButton"
-                                       x:Uid="clearEntryButton"
-                                       Grid.Column="0"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="12"
-                                       FontWeight="SemiBold"
-                                       AutomationProperties.AutomationId="clearEntryButton"
-                                       ButtonId="ClearEntry"
-                                       Content="CE"/>
-            <controls:CalculatorButton x:Name="ClearButton"
-                                       x:Uid="clearButton"
-                                       Grid.Column="1"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="12"
-                                       FontWeight="SemiBold"
-                                       AutomationProperties.AutomationId="clearButton"
-                                       ButtonId="Clear"
-                                       Content="C"/>
-            <controls:CalculatorButton x:Name="BackSpaceButton"
-                                       x:Uid="backSpaceButton"
-                                       Grid.Column="2"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       FontSize="12"
-                                       AutomationProperties.AutomationId="backSpaceButton"
-                                       ButtonId="Backspace"
-                                       Content="&#xE94F;"/>
-        </Grid>
-
         <Grid x:Uid="NumberPad"
-              Grid.Row="2"
-              Grid.RowSpan="4"
+              Grid.Row="1"
+              Grid.RowSpan="6"
               Grid.Column="1"
               Grid.ColumnSpan="5"
               AutomationProperties.AutomationId="NumberPad"
@@ -330,6 +613,8 @@
                 <RowDefinition/>
                 <RowDefinition/>
                 <RowDefinition/>
+                <RowDefinition/>
+                <RowDefinition/>
             </Grid.RowDefinitions>
             <Grid.ColumnDefinitions>
                 <ColumnDefinition/>
@@ -338,13 +623,6 @@
                 <ColumnDefinition/>
                 <ColumnDefinition/>
             </Grid.ColumnDefinitions>
-            <local:NumberPad x:Name="NumberPad"
-                             Grid.RowSpan="4"
-                             Grid.Column="2"
-                             Grid.ColumnSpan="3"
-                             ButtonStyle="{StaticResource NumericButtonStyle18}"
-                             CurrentRadixType="{x:Bind Model.CurrentRadixType, Mode=OneWay}"/>
-
             <controls:CalculatorButton x:Name="AButton"
                                        x:Uid="aButton"
                                        Grid.Row="0"
@@ -354,79 +632,73 @@
                                        ButtonId="A"
                                        Content="A"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
             <controls:CalculatorButton x:Name="BButton"
                                        x:Uid="bButton"
-                                       Grid.Row="0"
-                                       Grid.Column="1"
+                                       Grid.Row="1"
+                                       Grid.Column="0"
                                        Style="{StaticResource NumericButtonStyle12}"
                                        AutomationProperties.AutomationId="bButton"
                                        ButtonId="B"
                                        Content="B"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
             <controls:CalculatorButton x:Name="CButton"
                                        x:Uid="cButton"
-                                       Grid.Row="1"
+                                       Grid.Row="2"
                                        Grid.Column="0"
                                        Style="{StaticResource NumericButtonStyle12}"
                                        AutomationProperties.AutomationId="cButton"
                                        ButtonId="C"
                                        Content="C"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
             <controls:CalculatorButton x:Name="DButton"
                                        x:Uid="dButton"
-                                       Grid.Row="1"
-                                       Grid.Column="1"
+                                       Grid.Row="3"
+                                       Grid.Column="0"
                                        Style="{StaticResource NumericButtonStyle12}"
                                        AutomationProperties.AutomationId="dButton"
                                        ButtonId="D"
                                        Content="D"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
             <controls:CalculatorButton x:Name="EButton"
                                        x:Uid="eButton"
-                                       Grid.Row="2"
+                                       Grid.Row="4"
                                        Grid.Column="0"
                                        Style="{StaticResource NumericButtonStyle12}"
                                        AutomationProperties.AutomationId="eButton"
                                        ButtonId="E"
                                        Content="E"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
             <controls:CalculatorButton x:Name="FButton"
                                        x:Uid="fButton"
-                                       Grid.Row="2"
-                                       Grid.Column="1"
+                                       Grid.Row="5"
+                                       Grid.Column="0"
                                        Style="{StaticResource NumericButtonStyle12}"
                                        AutomationProperties.AutomationId="fButton"
                                        ButtonId="F"
                                        Content="F"
                                        IsEnabled="{x:Bind Model.AreHEXButtonsEnabled, Mode=OneWay}"/>
+
+            <local:NumberPad x:Name="NumberPad"
+                             Grid.Row="2"
+                             Grid.RowSpan="4"
+                             Grid.Column="1"
+                             Grid.ColumnSpan="3"
+                             ButtonStyle="{StaticResource NumericButtonStyle18}"
+                             CurrentRadixType="{x:Bind Model.CurrentRadixType, Mode=OneWay}"/>
         </Grid>
 
-        <controls:CalculatorButton x:Name="OpenParenthesisButton"
-                                   x:Uid="openParenthesisButton"
-                                   Grid.Row="5"
-                                   Grid.Column="1"
-                                   Style="{StaticResource ParenthesisCalcButtonStyle}"
-                                   FontSize="18"
-                                   AutomationProperties.AutomationId="openParenthesisButton"
-                                   ButtonId="OpenParenthesis"
-                                   Content="("
-                                   GotFocus="OpenParenthesisButton_GotFocus"
-                                   Tag="{x:Bind ParenthesisCountToString(Model.OpenParenthesisCount), Mode=OneWay}"/>
-        <controls:CalculatorButton x:Name="CloseParenthesisButton"
-                                   x:Uid="closeParenthesisButton"
-                                   Grid.Row="5"
-                                   Grid.Column="2"
-                                   Style="{StaticResource OperatorButtonStyle}"
-                                   FontSize="18"
-                                   AutomationProperties.AutomationId="closeParenthesisButton"
-                                   ButtonId="CloseParenthesis"
-                                   Content=")"/>
         <controls:CalculatorButton x:Name="NegateButton"
                                    x:Uid="negateButton"
-                                   Grid.Row="5"
-                                   Grid.Column="3"
-                                   Style="{StaticResource SymbolOperatorButtonStyle}"
+                                   Grid.Row="6"
+                                   Grid.Column="2"
+                                   Style="{StaticResource SymbolOperatorKeypadButtonStyle}"
                                    FontSize="12"
+                                   FontWeight="Normal"
                                    AutomationProperties.AutomationId="negateButton"
                                    ButtonId="Negate"
                                    Content="&#xF898;"/>

src/Calculator/Views/CalculatorProgrammerRadixOperators.xaml.cpp

@@ -29,32 +29,92 @@ CalculatorProgrammerRadixOperators::CalculatorProgrammerRadixOperators()
     InitializeComponent();
 }
 
-void CalculatorProgrammerRadixOperators::Shift_Clicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e)
+void CalculatorProgrammerRadixOperators::FlyoutButton_Clicked(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
 {
-    bool isShiftChecked = static_cast<ToggleButton ^>(sender)->IsChecked->Value;
-    auto scvm = safe_cast<StandardCalculatorViewModel ^>(this->DataContext);
-    scvm->IsShiftProgrammerChecked = isShiftChecked;
+    this->BitwiseFlyout->Hide();
+}
 
+void CalculatorProgrammerRadixOperators::checkDefaultBitShift()
+{
+    this->ArithmeticShiftButton->IsChecked = true;
+}
+
+void CalculatorProgrammerRadixOperators::BitshiftFlyout_Checked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e)
+{
+    // Load deferred load buttons
     if (RolButton == nullptr)
     {
         FindName("RolButton");
         FindName("RorButton");
+        FindName("RolCarryButton");
+        FindName("RorCarryButton");
+        FindName("LshLogicalButton");
+        FindName("RshLogicalButton");
     }
 
-    if (isShiftChecked)
+    // Since arithmeticShiftButton defaults to IsChecked = true, this event an fire before we can load the deferred loaded controls. If that is the case, just return and do nothing.
+    if (RolButton == nullptr || RorButton == nullptr || RolCarryButton == nullptr || RorCarryButton == nullptr || LshLogicalButton == nullptr
+        || RshLogicalButton == nullptr)
+    {
+        return;
+    }
+
+    CollapseBitshiftButtons();
+
+    auto radioButton = static_cast<RadioButton^>(sender);
+
+    if (radioButton == ArithmeticShiftButton)
+    {
+        LshButton->Visibility = ::Visibility::Visible;
+        RshButton->Visibility = ::Visibility::Visible;
+        LshButton->IsEnabled = true;
+        RshButton->IsEnabled = true;
+    }
+    else if (radioButton == LogicalShiftButton)
+    {
+        LshLogicalButton->Visibility = ::Visibility::Visible;
+        RshLogicalButton->Visibility = ::Visibility::Visible;
+        LshLogicalButton->IsEnabled = true;
+        RshLogicalButton->IsEnabled = true;
+    }
+    else if (radioButton == RotateCircularButton)
     {
         RolButton->Visibility = ::Visibility::Visible;
         RorButton->Visibility = ::Visibility::Visible;
-        LshButton->Visibility = ::Visibility::Collapsed;
-        RshButton->Visibility = ::Visibility::Collapsed;
+        RolButton->IsEnabled = true;
+        RorButton->IsEnabled = true;
     }
-    else
+    else if (radioButton == RotateCarryShiftButton)
     {
-        RolButton->Visibility = ::Visibility::Collapsed;
-        RorButton->Visibility = ::Visibility::Collapsed;
-        LshButton->Visibility = ::Visibility::Visible;
-        RshButton->Visibility = ::Visibility::Visible;
+        RolCarryButton->Visibility = ::Visibility::Visible;
+        RorCarryButton->Visibility = ::Visibility::Visible;
+        RolCarryButton->IsEnabled = true;
+        RorCarryButton->IsEnabled = true;
     }
+
+    this->BitShiftFlyout->Hide();
+}
+
+void CalculatorProgrammerRadixOperators::CollapseBitshiftButtons()
+{
+    RolButton->Visibility = ::Visibility::Collapsed;
+    RorButton->Visibility = ::Visibility::Collapsed;
+    RolCarryButton->Visibility = ::Visibility::Collapsed;
+    RorCarryButton->Visibility = ::Visibility::Collapsed;
+    LshButton->Visibility = ::Visibility::Collapsed;
+    RshButton->Visibility = ::Visibility::Collapsed;
+    LshLogicalButton->Visibility = ::Visibility::Collapsed;
+    RshLogicalButton->Visibility = ::Visibility::Collapsed;
+
+    // We need to set the collapsed buttons to disabled so that the KeyboardShortcutManager can skip the keybinds for the disabled buttons
+    RolButton->IsEnabled = false;
+    RorButton->IsEnabled = false;
+    RolCarryButton->IsEnabled = false;
+    RorCarryButton->IsEnabled = false;
+    LshButton->IsEnabled = false;
+    RshButton->IsEnabled = false;
+    LshLogicalButton->IsEnabled = false;
+    RshLogicalButton->IsEnabled = false;
 }
 
 bool CalculatorProgrammerRadixOperators::IsErrorVisualState::get()

src/Calculator/Views/CalculatorProgrammerRadixOperators.xaml.h

@@ -30,8 +30,12 @@ namespace CalculatorApp
 
         DEPENDENCY_PROPERTY_OWNER(CalculatorProgrammerRadixOperators);
 
+        void checkDefaultBitShift();
+
     private:
-        void Shift_Clicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void BitshiftFlyout_Checked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void FlyoutButton_Clicked(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void CollapseBitshiftButtons();
 
         bool m_isErrorVisualState;
         void OpenParenthesisButton_GotFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);

src/Calculator/Views/CalculatorScientificAngleButtons.xaml

@@ -47,8 +47,6 @@
                         <Setter Target="DegreeButton.Style" Value="{StaticResource CaptionButtonSmallStyle}"/>
                         <Setter Target="RadianButton.Style" Value="{StaticResource CaptionButtonSmallStyle}"/>
                         <Setter Target="GradsButton.Style" Value="{StaticResource CaptionButtonSmallStyle}"/>
-
-                        <Setter Target="HyperbolicButton.Style" Value="{StaticResource CaptionToggleButtonSmallStyle}"/>
                         <Setter Target="FtoeButton.Style" Value="{StaticResource CaptionToggleButtonSmallStyle}"/>
                     </VisualState.Setters>
                 </VisualState>
@@ -60,7 +58,6 @@
                         <Setter Target="DegreeButton.IsEnabled" Value="False"/>
                         <Setter Target="RadianButton.IsEnabled" Value="False"/>
                         <Setter Target="GradsButton.IsEnabled" Value="False"/>
-                        <Setter Target="HyperbolicButton.IsEnabled" Value="False"/>
                         <Setter Target="FtoeButton.IsEnabled" Value="False"/>
                     </VisualState.Setters>
                 </VisualState>
@@ -89,20 +86,9 @@
                 CommandParameter="2"
                 Content="GRAD"
                 Visibility="Collapsed"/>
-        <ToggleButton x:Name="HyperbolicButton"
-                      x:Uid="hyperbolicButton"
-                      Grid.Column="1"
-                      Style="{StaticResource CaptionToggleButtonStyle}"
-                      Background="{ThemeResource SystemControlBackgroundTransparentBrush}"
-                      FontWeight="SemiBold"
-                      AutomationProperties.AutomationId="hyperbolicButton"
-                      Checked="HypButton_Toggled"
-                      Content="HYP"
-                      IsChecked="{Binding IsHyperbolicChecked, Mode=TwoWay}"
-                      Unchecked="HypButton_Toggled"/>
         <ToggleButton x:Name="FtoeButton"
                       x:Uid="ftoeButton"
-                      Grid.Column="2"
+                      Grid.Column="1"
                       Style="{StaticResource CaptionToggleButtonStyle}"
                       Background="{ThemeResource SystemControlBackgroundTransparentBrush}"
                       FontWeight="SemiBold"

src/Calculator/Views/CalculatorScientificAngleButtons.xaml.cpp

@@ -35,10 +35,6 @@ CalculatorScientificAngleButtons::CalculatorScientificAngleButtons()
     InitializeComponent();
 }
 
-void CalculatorScientificAngleButtons::HypButton_Toggled(_In_ Object ^ sender, _In_ RoutedEventArgs ^ e)
-{
-}
-
 void CalculatorScientificAngleButtons::FToEButton_Toggled(_In_ Object ^ sender, _In_ RoutedEventArgs ^ e)
 {
     auto viewModel = safe_cast<StandardCalculatorViewModel ^>(this->DataContext);

src/Calculator/Views/CalculatorScientificAngleButtons.xaml.h

@@ -1,4 +1,4 @@
-// Copyright (c) Microsoft Corporation. All rights reserved.
+// Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
 //
@@ -35,7 +35,6 @@ namespace CalculatorApp
     private:
         void OnAngleButtonPressed(_In_ Platform::Object ^ commandParameter);
         void FToEButton_Toggled(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
-        void HypButton_Toggled(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
 
         bool m_isErrorVisualState;
     };

src/Calculator/Views/CalculatorScientificOperators.xaml.cpp

@@ -9,6 +9,7 @@
 #include "pch.h"
 #include "CalculatorScientificOperators.xaml.h"
 #include "CalcViewModel/Common/KeyboardShortcutManager.h"
+#include "CalcViewModel/Common/TraceLogger.h"
 #include "Controls/CalculatorButton.h"
 #include "CalcViewModel/StandardCalculatorViewModel.h"
 
@@ -20,6 +21,8 @@ using namespace std;
 using namespace Platform;
 using namespace Windows::Foundation;
 using namespace Windows::Foundation::Collections;
+using namespace Windows::UI::Core;
+using namespace Windows::UI::ViewManagement;
 using namespace Windows::UI::Xaml;
 using namespace Windows::UI::Xaml::Controls;
 using namespace Windows::UI::Xaml::Controls::Primitives;
@@ -27,30 +30,15 @@ using namespace Windows::UI::Xaml::Data;
 using namespace Windows::UI::Xaml::Input;
 using namespace Windows::UI::Xaml::Media;
 using namespace Windows::UI::Xaml::Navigation;
+using namespace Windows::UI::Core;
 
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculatorScientificOperators, IsErrorVisualState);
-DEPENDENCY_PROPERTY_INITIALIZATION(CalculatorScientificOperators, IsWideLayout);
 
 CalculatorScientificOperators::CalculatorScientificOperators()
 {
     InitializeComponent();
 
     ExpButton->SetValue(Common::KeyboardShortcutManager::VirtualKeyProperty, Common::MyVirtualKey::E);
-    Common::KeyboardShortcutManager::ShiftButtonChecked(false);
-}
-
-void CalculatorScientificOperators::ShortLayout_Completed(_In_ Platform::Object ^ /*sender*/, _In_ Platform::Object ^ /*e*/)
-{
-    IsWideLayout = false;
-    SetOperatorRowVisibility();
-    Common::KeyboardShortcutManager::ShiftButtonChecked(Model->IsShiftChecked);
-}
-
-void CalculatorScientificOperators::WideLayout_Completed(_In_ Platform::Object ^ /*sender*/, _In_ Platform::Object ^ /*e*/)
-{
-    IsWideLayout = true;
-    SetOperatorRowVisibility();
-    Common::KeyboardShortcutManager::ShiftButtonChecked(Model->IsShiftChecked);
 }
 
 void CalculatorScientificOperators::OnIsErrorVisualStatePropertyChanged(bool /*oldValue*/, bool newValue)
@@ -60,31 +48,75 @@ void CalculatorScientificOperators::OnIsErrorVisualStatePropertyChanged(bool /*o
     NumberPad->IsErrorVisualState = newValue;
 }
 
-void CalculatorScientificOperators::shiftButton_Check(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+void CalculatorScientificOperators::ShiftButton_Check(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
 {
-    bool isChecked = ShiftButton->IsChecked->Value;
-    Model->IsShiftChecked = isChecked;
-    Common::KeyboardShortcutManager::ShiftButtonChecked(isChecked);
     SetOperatorRowVisibility();
 }
 
-void CalculatorScientificOperators::shiftButton_IsEnabledChanged(
+void CalculatorScientificOperators::ShiftButton_Uncheck(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    ShiftButton->IsChecked = false;
+    SetOperatorRowVisibility();
+    ShiftButton->Focus(::FocusState::Programmatic);
+}
+
+void CalculatorScientificOperators::TrigFlyoutShift_Toggle(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    SetTrigRowVisibility();
+}
+
+void CalculatorScientificOperators::TrigFlyoutHyp_Toggle(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    SetTrigRowVisibility();
+}
+
+void CalculatorScientificOperators::FlyoutButton_Clicked(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    this->HypButton->IsChecked = false;
+    this->TrigShiftButton->IsChecked = false;
+    this->Trigflyout->Hide();
+    this->FuncFlyout->Hide();
+}
+
+void CalculatorScientificOperators::ShiftButton_IsEnabledChanged(
     _In_ Platform::Object ^ /*sender*/,
     _In_ Windows::UI::Xaml::DependencyPropertyChangedEventArgs ^ /*e*/)
 {
     SetOperatorRowVisibility();
-    Common::KeyboardShortcutManager::ShiftButtonChecked(ShiftButton->IsEnabled && ShiftButton->IsChecked->Value);
+}
+
+void CalculatorScientificOperators::SetTrigRowVisibility()
+{
+    bool isShiftChecked = TrigShiftButton->IsChecked->Value;
+    bool isHypeChecked = HypButton->IsChecked->Value;
+
+    InverseHyperbolicTrigFunctions->Visibility = ::Visibility::Collapsed;
+    InverseTrigFunctions->Visibility = ::Visibility::Collapsed;
+    HyperbolicTrigFunctions->Visibility = ::Visibility::Collapsed;
+    TrigFunctions->Visibility = ::Visibility::Collapsed;
+
+    if (isShiftChecked && isHypeChecked)
+    {
+        InverseHyperbolicTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else if (isShiftChecked && !isHypeChecked)
+    {
+        InverseTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else if (!isShiftChecked && isHypeChecked)
+    {
+        HyperbolicTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else
+    {
+        TrigFunctions->Visibility = ::Visibility::Visible;
+    }
 }
 
 void CalculatorScientificOperators::SetOperatorRowVisibility()
 {
     ::Visibility rowVis, invRowVis;
-    if (IsWideLayout)
-    {
-        rowVis = ::Visibility::Visible;
-        invRowVis = ::Visibility::Visible;
-    }
-    else if (ShiftButton->IsChecked->Value)
+    if (ShiftButton->IsChecked->Value)
     {
         rowVis = ::Visibility::Collapsed;
         invRowVis = ::Visibility::Visible;
@@ -96,9 +128,7 @@ void CalculatorScientificOperators::SetOperatorRowVisibility()
     }
 
     Row1->Visibility = rowVis;
-    Row2->Visibility = rowVis;
     InvRow1->Visibility = invRowVis;
-    InvRow2->Visibility = invRowVis;
 }
 
 void CalculatorScientificOperators::OpenParenthesisButton_GotFocus(Object ^ sender, RoutedEventArgs ^ e)

src/Calculator/Views/CalculatorScientificOperators.xaml.h

@@ -29,21 +29,19 @@ namespace CalculatorApp
 
         DEPENDENCY_PROPERTY_OWNER(CalculatorScientificOperators);
         DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(bool, IsErrorVisualState, false);
-        DEPENDENCY_PROPERTY_WITH_DEFAULT(bool, IsWideLayout, false);
 
-        bool IsShiftEnabled(bool isWideLayout, bool isErrorState)
-        {
-            return !(isWideLayout || isErrorState);
-        }
         void OpenParenthesisButton_GotFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
         Platform::String ^ ParenthesisCountToString(unsigned int count);
 
     private:
-        void ShortLayout_Completed(_In_ Platform::Object ^ sender, _In_ Platform::Object ^ e);
-        void WideLayout_Completed(_In_ Platform::Object ^ sender, _In_ Platform::Object ^ e);
         void OnIsErrorVisualStatePropertyChanged(bool oldValue, bool newValue);
-        void shiftButton_Check(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
-        void shiftButton_IsEnabledChanged(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::DependencyPropertyChangedEventArgs ^ e);
+        void ShiftButton_Check(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void ShiftButton_Uncheck(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void TrigFlyoutShift_Toggle(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void TrigFlyoutHyp_Toggle(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void FlyoutButton_Clicked(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void ShiftButton_IsEnabledChanged(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::DependencyPropertyChangedEventArgs ^ e);
         void SetOperatorRowVisibility();
+        void SetTrigRowVisibility();
     };
 }

src/Calculator/Views/CalculatorStandardOperators.xaml

@@ -6,7 +6,9 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:local="using:CalculatorApp"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:triggers="using:CalculatorApp.Views.StateTriggers"
              x:Name="ControlRoot"
+             XYFocusKeyboardNavigation="Enabled"
              mc:Ignorable="d">
 
     <Grid x:Name="Root">
@@ -36,7 +38,6 @@
                         <Setter Target="PercentButton.IsEnabled" Value="False"/>
                         <Setter Target="SquareRootButton.IsEnabled" Value="False"/>
                         <Setter Target="XPower2Button.IsEnabled" Value="False"/>
-                        <Setter Target="XPower3Button.IsEnabled" Value="False"/>
                         <Setter Target="InvertButton.IsEnabled" Value="False"/>
                         <Setter Target="DivideButton.IsEnabled" Value="False"/>
                         <Setter Target="MultiplyButton.IsEnabled" Value="False"/>
@@ -47,37 +48,77 @@
                 </VisualState>
             </VisualStateGroup>
             <VisualStateGroup>
-                <VisualState x:Name="NormalFontSize">
+                <VisualState x:Name="Large">
                     <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="440" MinWindowWidth="0"/>
+                        <triggers:ControlSizeTrigger MinWidth="780"
+                                                     MinHeight="814"
+                                                     Source="{x:Bind Root}"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
-                        <Setter Target="PercentButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="SquareRootButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="XPower2Button.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="InvertButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="NegateButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="ClearEntryButton.Style" Value="{StaticResource OperatorButtonStyle}"/>
-                        <Setter Target="ClearButton.Style" Value="{StaticResource OperatorButtonStyle}"/>
-                        <Setter Target="BackSpaceButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="DivideButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="MultiplyButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="MinusButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="PlusButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="EqualButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
+                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcButtonCaptionSize}"/>
+
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle38}"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="Medium">
+                    <VisualState.StateTriggers>
+                        <triggers:ControlSizeTrigger MinWidth="468"
+                                                     MinHeight="500"
+                                                     Source="{x:Bind Root}"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
 
                         <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle24}"/>
                     </VisualState.Setters>
                 </VisualState>
-                <VisualState x:Name="SmallFontSize">
+                <VisualState x:Name="Small">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="260" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
+                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcOperatorCaptionSize}"/>
+
                         <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle18}"/>
                     </VisualState.Setters>
                 </VisualState>
-                <VisualState x:Name="TinyFontSize">
+                <VisualState x:Name="Tiny">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
@@ -101,239 +142,81 @@
                 </VisualState>
             </VisualStateGroup>
             <VisualStateGroup>
-                <VisualState x:Name="Portrait768x1366">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="1366" MinWindowWidth="768"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower3Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle46}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="Landscape13InchLaptop">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="768" MinWindowWidth="1366"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="C0.Width" Value="1*"/>
-                        <Setter Target="R0.Height" Value="0"/>
-
-                        <Setter Target="StandardFunctions.(Grid.Row)" Value="1"/>
-                        <Setter Target="StandardFunctions.(Grid.Column)" Value="1"/>
-                        <Setter Target="StandardFunctions.(Grid.RowSpan)" Value="5"/>
-                        <Setter Target="StandardFunctions.(Grid.ColumnSpan)" Value="1"/>
-                        <Setter Target="FnR1.Height" Value="1*"/>
-                        <Setter Target="FnR2.Height" Value="1*"/>
-                        <Setter Target="FnR3.Height" Value="1*"/>
-                        <Setter Target="FnR4.Height" Value="1*"/>
-                        <Setter Target="FnC1.Width" Value="0"/>
-                        <Setter Target="FnC2.Width" Value="0"/>
-                        <Setter Target="FnC3.Width" Value="0"/>
-
-                        <Setter Target="SquareRootButton.(Grid.Row)" Value="1"/>
-                        <Setter Target="SquareRootButton.(Grid.Column)" Value="0"/>
-                        <Setter Target="XPower2Button.(Grid.Row)" Value="2"/>
-                        <Setter Target="XPower2Button.(Grid.Column)" Value="0"/>
-                        <Setter Target="XPower3Button.Visibility" Value="Visible"/>
-                        <Setter Target="InvertButton.(Grid.Row)" Value="4"/>
-                        <Setter Target="InvertButton.(Grid.Column)" Value="0"/>
-
-                        <Setter Target="NegateButton.(Grid.Row)" Value="5"/>
-                        <Setter Target="NegateButton.(Grid.Column)" Value="2"/>
-
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle34}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="Landscape8InchTab">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="640" MinWindowWidth="1024"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="C0.Width" Value="1*"/>
-                        <Setter Target="R0.Height" Value="0"/>
-
-                        <Setter Target="StandardFunctions.(Grid.Row)" Value="1"/>
-                        <Setter Target="StandardFunctions.(Grid.Column)" Value="1"/>
-                        <Setter Target="StandardFunctions.(Grid.RowSpan)" Value="5"/>
-                        <Setter Target="StandardFunctions.(Grid.ColumnSpan)" Value="1"/>
-                        <Setter Target="FnR1.Height" Value="1*"/>
-                        <Setter Target="FnR2.Height" Value="1*"/>
-                        <Setter Target="FnR3.Height" Value="1*"/>
-                        <Setter Target="FnR4.Height" Value="1*"/>
-                        <Setter Target="FnC1.Width" Value="0"/>
-                        <Setter Target="FnC2.Width" Value="0"/>
-                        <Setter Target="FnC3.Width" Value="0"/>
-
-                        <Setter Target="SquareRootButton.(Grid.Row)" Value="1"/>
-                        <Setter Target="SquareRootButton.(Grid.Column)" Value="0"/>
-                        <Setter Target="XPower2Button.(Grid.Row)" Value="2"/>
-                        <Setter Target="XPower2Button.(Grid.Column)" Value="0"/>
-                        <Setter Target="XPower3Button.Visibility" Value="Visible"/>
-                        <Setter Target="InvertButton.(Grid.Row)" Value="4"/>
-                        <Setter Target="InvertButton.(Grid.Column)" Value="0"/>
-
-                        <Setter Target="NegateButton.(Grid.Row)" Value="5"/>
-                        <Setter Target="NegateButton.(Grid.Column)" Value="2"/>
-
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower3Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle28}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="Portrait8InchTab">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="1024" MinWindowWidth="640"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower3Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle28}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="Portrait6InchPhone">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="854" MinWindowWidth="480"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeLarge}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle34}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="Portrait5InchPhone">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="640" MinWindowWidth="360"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSize}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle28}"/>
-                    </VisualState.Setters>
-                </VisualState>
-                <VisualState x:Name="MinSizeLayout">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="{StaticResource AppMinWindowHeight}" MinWindowWidth="{StaticResource AppMinWindowWidth}"/>
-                    </VisualState.StateTriggers>
-                    <VisualState.Setters>
-                        <Setter Target="PercentButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="SquareRootButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="XPower2Button.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="InvertButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="NegateButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="ClearEntryButton.Style" Value="{StaticResource OperatorButtonStyle}"/>
-                        <Setter Target="ClearButton.Style" Value="{StaticResource OperatorButtonStyle}"/>
-                        <Setter Target="BackSpaceButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="DivideButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="MultiplyButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="MinusButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="PlusButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-                        <Setter Target="EqualButton.Style" Value="{StaticResource SymbolOperatorButtonStyle}"/>
-
-                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle24}"/>
-                    </VisualState.Setters>
-                </VisualState>
                 <VisualState x:Name="ShowStandardFunctions">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="394" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
-                        <Setter Target="R0.Height" Value="1*"/>
+                        <Setter Target="R1.Height" Value="1*"/>
                         <Setter Target="StandardFunctions.Visibility" Value="Visible"/>
                     </VisualState.Setters>
                 </VisualState>
-                <VisualState x:Name="DefaultLayout">
+                <VisualState x:Name="HideStandardFunctions">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
-                        <Setter Target="R0.Height" Value="0*"/>
+                        <Setter Target="R1.Height" Value="0*"/>
                         <Setter Target="StandardFunctions.Visibility" Value="Collapsed"/>
+                        <Setter Target="PercentButton.Visibility" Value="Collapsed"/>
+                        <Setter Target="PercentColumn.Width" Value="0"/>
+                        <Setter Target="DisplayControls.Column" Value="1"/>
+                        <Setter Target="DisplayControls.ColumnSpan" Value="4"/>
+                        <Setter Target="StandardOperators.Row" Value="0"/>
+                        <Setter Target="StandardOperators.RowSpan" Value="6"/>
                     </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
 
+        <Grid x:Name="DisplayControls"
+              x:Uid="DisplayControls"
+              Grid.Row="0"
+              Grid.Column="2"
+              Grid.ColumnSpan="4"
+              AutomationProperties.HeadingLevel="Level1">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition x:Name="PercentColumn"/>
+                <ColumnDefinition/>
+                <ColumnDefinition/>
+                <ColumnDefinition/>
+            </Grid.ColumnDefinitions>
+            <controls:CalculatorButton x:Name="PercentButton"
+                                       x:Uid="percentButton"
+                                       Grid.Column="0"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       AutomationProperties.AutomationId="percentButton"
+                                       ButtonId="Percent"
+                                       Content="&#xE94C;"/>
+            <controls:CalculatorButton x:Name="ClearEntryButton"
+                                       x:Uid="clearEntryButton"
+                                       Grid.Column="1"
+                                       Style="{StaticResource OperatorButtonStyle}"
+                                       FontSize="16"
+                                       AutomationProperties.AutomationId="clearEntryButton"
+                                       ButtonId="ClearEntry"
+                                       Content="CE"/>
+            <controls:CalculatorButton x:Name="ClearButton"
+                                       x:Uid="clearButton"
+                                       Grid.Column="2"
+                                       Style="{StaticResource OperatorButtonStyle}"
+                                       FontSize="16"
+                                       AutomationProperties.AutomationId="clearButton"
+                                       ButtonId="Clear"
+                                       Content="C"/>
+            <controls:CalculatorButton x:Name="BackSpaceButton"
+                                       x:Uid="backSpaceButton"
+                                       Grid.Column="3"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       FontSize="16"
+                                       AutomationProperties.AutomationId="backSpaceButton"
+                                       ButtonId="Backspace"
+                                       Content="&#xE94F;"/>
+        </Grid>
+
         <Grid x:Name="StandardFunctions"
               x:Uid="StandardFunctions"
-              Grid.Row="0"
+              Grid.Row="1"
               Grid.Column="2"
               Grid.ColumnSpan="4"
               AutomationProperties.HeadingLevel="Level1">
@@ -350,45 +233,28 @@
                 <ColumnDefinition x:Name="FnC2" Width="1*"/>
                 <ColumnDefinition x:Name="FnC3" Width="1*"/>
             </Grid.ColumnDefinitions>
-            <controls:CalculatorButton x:Name="PercentButton"
-                                       x:Uid="percentButton"
-                                       Grid.Column="0"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       AutomationProperties.AutomationId="percentButton"
-                                       ButtonId="Percent"
-                                       Content="&#xE94C;"/>
-            <controls:CalculatorButton x:Name="SquareRootButton"
-                                       x:Uid="squareRootButton"
-                                       Grid.Column="1"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       AutomationProperties.AutomationId="squareRootButton"
-                                       ButtonId="Sqrt"
-                                       Content="&#xF899;"/>
-            <controls:CalculatorButton x:Name="XPower2Button"
-                                       x:Uid="xpower2Button"
-                                       Grid.Column="2"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       FontSize="18"
-                                       AutomationProperties.AutomationId="xpower2Button"
-                                       ButtonId="XPower2"
-                                       Content="&#xf7c8;"/>
-            <controls:CalculatorButton x:Name="XPower3Button"
-                                       x:Uid="xpower3Button"
-                                       Grid.Row="3"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       FontSize="18"
-                                       AutomationProperties.AutomationId="xpower3Button"
-                                       ButtonId="Cube"
-                                       Content="&#xf7cb;"
-                                       Visibility="Collapsed"/>
             <controls:CalculatorButton x:Name="InvertButton"
                                        x:Uid="invertButton"
-                                       Grid.Column="3"
                                        Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="18"
                                        AutomationProperties.AutomationId="invertButton"
                                        ButtonId="Invert"
                                        Content="&#xf7c9;"/>
+            <controls:CalculatorButton x:Name="XPower2Button"
+                                       x:Uid="xpower2Button"
+                                       Grid.Column="1"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       FontSize="18"
+                                       AutomationProperties.AutomationId="xpower2Button"
+                                       ButtonId="XPower2"
+                                       Content="&#xf7c8;"/>
+            <controls:CalculatorButton x:Name="SquareRootButton"
+                                       x:Uid="squareRootButton"
+                                       Grid.Column="2"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       AutomationProperties.AutomationId="squareRootButton"
+                                       ButtonId="Sqrt"
+                                       Content="&#xF899;"/>
         </Grid>
 
         <Grid x:Name="StandardOperators"
@@ -407,77 +273,40 @@
             <controls:CalculatorButton x:Name="DivideButton"
                                        x:Uid="divideButton"
                                        Grid.Row="0"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        AutomationProperties.AutomationId="divideButton"
                                        ButtonId="Divide"
                                        Content="&#xE94A;"/>
             <controls:CalculatorButton x:Name="MultiplyButton"
                                        x:Uid="multiplyButton"
                                        Grid.Row="1"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        AutomationProperties.AutomationId="multiplyButton"
                                        ButtonId="Multiply"
                                        Content="&#xE947;"/>
             <controls:CalculatorButton x:Name="MinusButton"
                                        x:Uid="minusButton"
                                        Grid.Row="2"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        AutomationProperties.AutomationId="minusButton"
                                        ButtonId="Subtract"
                                        Content="&#xE949;"/>
             <controls:CalculatorButton x:Name="PlusButton"
                                        x:Uid="plusButton"
                                        Grid.Row="3"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorButtonStyle}"
                                        AutomationProperties.AutomationId="plusButton"
                                        ButtonId="Add"
                                        Content="&#xE948;"/>
             <controls:CalculatorButton x:Name="EqualButton"
                                        x:Uid="equalButton"
                                        Grid.Row="4"
-                                       Style="{StaticResource AccentCalcButtonStyle}"
+                                       Style="{StaticResource AccentEmphasizedCalcButtonStyle}"
                                        AutomationProperties.AutomationId="equalButton"
                                        ButtonId="Equals"
                                        Content="&#xE94E;"/>
         </Grid>
 
-        <Grid x:Name="DisplayControls"
-              x:Uid="DisplayControls"
-              Grid.Row="1"
-              Grid.Column="2"
-              Grid.ColumnSpan="3"
-              AutomationProperties.HeadingLevel="Level1">
-            <Grid.ColumnDefinitions>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-                <ColumnDefinition/>
-            </Grid.ColumnDefinitions>
-            <controls:CalculatorButton x:Name="ClearEntryButton"
-                                       x:Uid="clearEntryButton"
-                                       Grid.Column="0"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="16"
-                                       AutomationProperties.AutomationId="clearEntryButton"
-                                       ButtonId="ClearEntry"
-                                       Content="CE"/>
-            <controls:CalculatorButton x:Name="ClearButton"
-                                       x:Uid="clearButton"
-                                       Grid.Column="1"
-                                       Style="{StaticResource OperatorButtonStyle}"
-                                       FontSize="16"
-                                       AutomationProperties.AutomationId="clearButton"
-                                       ButtonId="Clear"
-                                       Content="C"/>
-            <controls:CalculatorButton x:Name="BackSpaceButton"
-                                       x:Uid="backSpaceButton"
-                                       Grid.Column="2"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
-                                       FontSize="16"
-                                       AutomationProperties.AutomationId="backSpaceButton"
-                                       ButtonId="Backspace"
-                                       Content="&#xE94F;"/>
-        </Grid>
-
         <local:NumberPad x:Name="NumberPad"
                          x:Uid="NumberPad"
                          Grid.Row="2"
@@ -491,7 +320,8 @@
                                    x:Uid="negateButton"
                                    Grid.Row="5"
                                    Grid.Column="2"
-                                   Style="{StaticResource SymbolOperatorButtonStyle}"
+                                   Style="{StaticResource SymbolOperatorKeypadButtonStyle}"
+                                   FontWeight="Normal"
                                    AutomationProperties.AutomationId="negateButton"
                                    ButtonId="Negate"
                                    Content="&#xF898;"/>

src/Calculator/Views/CalculatorStandardOperators.xaml.cpp

@@ -8,6 +8,7 @@
 
 #include "pch.h"
 #include "CalculatorStandardOperators.xaml.h"
+#include "Controls/CalculatorButton.h"
 
 using namespace CalculatorApp;
 

src/Calculator/Views/NumberPad.xaml

@@ -1,4 +1,4 @@
-<UserControl x:Class="CalculatorApp.NumberPad"
+<UserControl x:Class="CalculatorApp.NumberPad"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:common="using:CalculatorApp.Common"
@@ -112,7 +112,6 @@
                                    Grid.Row="3"
                                    Grid.Column="2"
                                    Style="{Binding ElementName=ControlRoot, Path=ButtonStyle}"
-                                   Background="{ThemeResource AppBackgroundAltMediumLowBrush}"
                                    common:KeyboardShortcutManager.Character="."
                                    AutomationProperties.AutomationId="decimalSeparatorButton"
                                    ButtonId="Decimal"

src/Calculator/Views/OperatorsPanel.xaml

@@ -10,26 +10,26 @@
              mc:Ignorable="d">
     <Grid>
         <local:CalculatorStandardOperators x:Name="StandardOperators"
-                                           x:Load="{x:Bind Model.IsStandard, Mode=OneWay}"
+                                           TabIndex="17"
                                            IsEnabled="{x:Bind Model.IsStandard, Mode=OneWay}"
-                                           TabIndex="17"/>
+                                           x:Load="{x:Bind Model.IsStandard, Mode=OneWay}"/>
 
         <local:CalculatorScientificOperators x:Name="ScientificOperators"
-                                             x:Load="False"
-                                             IsEnabled="{x:Bind Model.IsScientific, Mode=OneWay}"
                                              TabIndex="16"
-                                             Visibility="{x:Bind Model.IsScientific, Mode=OneWay}"/>
+                                             Visibility="{x:Bind Model.IsScientific, Mode=OneWay}"
+                                             IsEnabled="{x:Bind Model.IsScientific, Mode=OneWay}"
+                                             x:Load="False"/>
 
         <local:CalculatorProgrammerBitFlipPanel x:Name="BitFlipPanel"
-                                                x:Load="False"
+                                                Visibility="{x:Bind Model.IsBinaryBitFlippingEnabled, Mode=OneWay}"
                                                 IsEnabled="{x:Bind Model.IsBinaryBitFlippingEnabled, Mode=OneWay}"
-                                                Visibility="{x:Bind Model.IsBinaryBitFlippingEnabled, Mode=OneWay}"/>
+                                                x:Load="False"/>
 
         <local:CalculatorProgrammerRadixOperators x:Name="ProgrammerRadixOperators"
-                                                  x:Load="False"
-                                                  IsEnabled="{x:Bind Model.AreProgrammerRadixOperatorsEnabled, Mode=OneWay}"
                                                   TabIndex="16"
-                                                  Visibility="{x:Bind Model.AreProgrammerRadixOperatorsEnabled, Mode=OneWay}"/>
+                                                  Visibility="{x:Bind Model.AreProgrammerRadixOperatorsEnabled, Mode=OneWay}"
+                                                  IsEnabled="{x:Bind Model.AreProgrammerRadixOperatorsEnabled, Mode=OneWay}"
+                                                  x:Load="False"/>
 
     </Grid>
 </UserControl>

src/Calculator/Views/OperatorsPanel.xaml.cpp

@@ -1,4 +1,4 @@
-// Copyright (c) Microsoft Corporation. All rights reserved.
+// Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
 #include "pch.h"
@@ -71,6 +71,11 @@ void OperatorsPanel::EnsureProgrammerRadixOps()
     {
         this->FindName(L"ProgrammerRadixOperators");
     }
+
+    if (ProgrammerRadixOperators)
+    {
+        ProgrammerRadixOperators->checkDefaultBitShift();
+    }
 }
 
 void OperatorsPanel::EnsureProgrammerBitFlipPanel()

src/Calculator/Views/StateTriggers/ControlSizeTrigger.cpp

@@ -0,0 +1,80 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+
+#include "pch.h"
+#include "ControlSizeTrigger.h"
+
+using namespace CalculatorApp::Views::StateTriggers;
+using namespace Platform;
+using namespace Windows::Foundation;
+using namespace Windows::UI::Xaml;
+
+DEPENDENCY_PROPERTY_INITIALIZATION(ControlSizeTrigger, Source);
+DEPENDENCY_PROPERTY_INITIALIZATION(ControlSizeTrigger, MinHeight);
+DEPENDENCY_PROPERTY_INITIALIZATION(ControlSizeTrigger, MinWidth);
+
+ControlSizeTrigger::ControlSizeTrigger()
+{
+    SetActive(false);
+}
+
+ControlSizeTrigger::~ControlSizeTrigger()
+{
+    UnregisterSizeChanged(Source);
+}
+
+void ControlSizeTrigger::OnSourcePropertyChanged(FrameworkElement^ oldValue, FrameworkElement^ newValue)
+{
+    UnregisterSizeChanged(oldValue);
+    RegisterSizeChanged(newValue);
+}
+
+void ControlSizeTrigger::RegisterSizeChanged(FrameworkElement^ element)
+{
+    if (element == nullptr) { return; }
+
+    if (element != Source)
+    {
+        UnregisterSizeChanged(Source);
+    }
+
+    m_sizeChangedToken =
+        element->SizeChanged += ref new SizeChangedEventHandler(this, &ControlSizeTrigger::OnSizeChanged);
+}
+
+void ControlSizeTrigger::UnregisterSizeChanged(FrameworkElement^ element)
+{
+    if ((element != nullptr) && (m_sizeChangedToken.Value != 0))
+    {
+        element->SizeChanged -= m_sizeChangedToken;
+        m_sizeChangedToken.Value = 0;
+    }
+}
+
+void ControlSizeTrigger::OnSizeChanged(Object^ sender, SizeChangedEventArgs^ e)
+{
+    UpdateIsActive(e->NewSize);
+}
+
+void ControlSizeTrigger::UpdateIsActive(Size sourceSize)
+{
+    if (Source != nullptr && MinWidth > 0 || MinHeight > 0)
+    {
+        if (MinHeight > 0 && MinWidth > 0)
+        {
+            SetActive((sourceSize.Height >= MinHeight) && (sourceSize.Width >= MinWidth));
+        }
+        else if (MinHeight > 0)
+        {
+            SetActive(sourceSize.Height >= MinHeight);
+        }
+        else
+        {
+            SetActive(sourceSize.Width >= MinWidth);
+        }
+    }
+    else
+    {
+        SetActive(false);
+    }
+}

src/Calculator/Views/StateTriggers/ControlSizeTrigger.h

@@ -0,0 +1,37 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+
+#pragma once
+
+#include "CalcViewModel/Common/Utils.h"
+
+namespace CalculatorApp::Views::StateTriggers
+{
+    public ref class ControlSizeTrigger sealed : public Windows::UI::Xaml::StateTriggerBase
+    {
+    public:
+        ControlSizeTrigger();
+
+        DEPENDENCY_PROPERTY_OWNER(ControlSizeTrigger);
+
+        DEPENDENCY_PROPERTY_WITH_CALLBACK(Windows::UI::Xaml::FrameworkElement^, Source);
+
+        DEPENDENCY_PROPERTY_WITH_DEFAULT(double, MinHeight, 0.0);
+
+        DEPENDENCY_PROPERTY_WITH_DEFAULT(double, MinWidth, 0.0);
+
+    private:
+        ~ControlSizeTrigger();
+
+        void OnSourcePropertyChanged(Windows::UI::Xaml::FrameworkElement^ oldValue, Windows::UI::Xaml::FrameworkElement^ newValue);
+
+        void RegisterSizeChanged(Windows::UI::Xaml::FrameworkElement^ element);
+        void UnregisterSizeChanged(Windows::UI::Xaml::FrameworkElement^ element);
+        void OnSizeChanged(Platform::Object^ sender, Windows::UI::Xaml::SizeChangedEventArgs^ e);
+
+        void UpdateIsActive(Windows::Foundation::Size sourceSize);
+
+    private:
+        Windows::Foundation::EventRegistrationToken m_sizeChangedToken;
+    };
+}

src/Calculator/Views/UnitConverter.xaml

@@ -702,7 +702,8 @@
               Grid.Column="1"
               Margin="3,0,3,3"
               FlowDirection="LeftToRight"
-              RenderTransformOrigin="0.5,0.5">
+              RenderTransformOrigin="0.5,0.5"
+              XYFocusKeyboardNavigation="Enabled">
             <Grid.RenderTransform>
                 <CompositeTransform/>
             </Grid.RenderTransform>
@@ -761,7 +762,7 @@
                                        x:Uid="converterNegateButton"
                                        Grid.Row="4"
                                        Grid.Column="0"
-                                       Style="{StaticResource SymbolOperatorButtonStyle}"
+                                       Style="{StaticResource SymbolOperatorKeypadButtonStyle}"
                                        FontSize="16"
                                        ButtonId="Negate"
                                        Content="&#xF898;"