From af41a183a7984d505ce45bca2b255ac1488bc977 Mon Sep 17 00:00:00 2001
From: Rudy Huyn <rudyhuyn@gmail.com>
Date: Fri, 5 Apr 2019 13:04:39 -0700
Subject: [PATCH] Optimize and simplify CalculationResult to be able to update
 the FontSize and the DisplayMargin without fully updating the Style. (#217)

- Merge the 3 CalculationResultStyle(S|M|L) in App.xaml
- Only modify CalculationResult::*FontSize in Calculator.xaml instead of fully updating the style of the control.
- Create a new property MaxFontSize in order to be able to update it without being forced to fully update the Style (because m_startingFontSize was set in OnApplyTemplate)
- Modify how DisplayMargin is managed to prevent the textblock Margin to shift when we update its value (without fully updating the Style).
---
 src/Calculator/App.xaml                       | 181 +-----------------
 src/Calculator/Controls/CalculationResult.cpp |  32 ++--
 src/Calculator/Controls/CalculationResult.h   |   6 +-
 src/Calculator/Views/Calculator.xaml          |  68 +++----
 src/Calculator/Views/Calculator.xaml.cpp      |  39 +---
 src/Calculator/Views/Calculator.xaml.h        |   4 +-
 src/Calculator/Views/UnitConverter.xaml       |  38 ++--
 7 files changed, 60 insertions(+), 308 deletions(-)

diff --git a/src/Calculator/App.xaml b/src/Calculator/App.xaml
index 51c2846..cec835f 100644
--- a/src/Calculator/App.xaml
+++ b/src/Calculator/App.xaml
@@ -134,10 +134,6 @@
             <!-- Standard Operators Standard/Scientific in Fill/Full -->
             <x:Double x:Key="CalcOperatorCaptionSize">15</x:Double>
 
-            <x:Double x:Key="CalcResultFontSizeL">72</x:Double>
-            <x:Double x:Key="CalcResultFontSizeM">46</x:Double>
-            <x:Double x:Key="CalcResultFontSizeS">28</x:Double>
-
             <!-- Base style for calc buttons -->
             <Style x:Key="CalcButtonStyle" TargetType="Controls:CalculatorButton">
                 <Setter Property="MinWidth" Value="24"/>
@@ -360,7 +356,7 @@
                 <Setter Property="ZoomMode" Value="Disabled"/>
             </Style>
 
-            <Style x:Key="CalculationResultStyleL" TargetType="Controls:CalculationResult">
+            <Style x:Key="CalculationResultStyle" TargetType="Controls:CalculationResult">
                 <Setter Property="Background" Value="Transparent"/>
                 <Setter Property="Foreground" Value="{ThemeResource SystemControlPageTextBaseHighBrush}"/>
                 <Setter Property="HorizontalAlignment" Value="Stretch"/>
@@ -447,181 +443,6 @@
                     </Setter.Value>
                 </Setter>
             </Style>
-            <Style x:Key="CalculationResultStyleM" TargetType="Controls:CalculationResult">
-                <Setter Property="Background" Value="Transparent"/>
-                <Setter Property="Foreground" Value="{ThemeResource SystemControlPageTextBaseHighBrush}"/>
-                <Setter Property="HorizontalAlignment" Value="Stretch"/>
-                <Setter Property="VerticalAlignment" Value="Stretch"/>
-                <Setter Property="HorizontalContentAlignment" Value="Right"/>
-                <Setter Property="VerticalContentAlignment" Value="Top"/>
-                <Setter Property="IsTextScaleFactorEnabled" Value="False"/>
-                <Setter Property="UseSystemFocusVisuals" Value="True"/>
-                <Setter Property="Template">
-                    <Setter.Value>
-                        <ControlTemplate TargetType="Controls:CalculationResult">
-                            <Grid x:Name="border" Background="{TemplateBinding Background}">
-                                <Grid.ColumnDefinitions>
-                                    <ColumnDefinition Width="12"/>
-                                    <ColumnDefinition/>
-                                    <ColumnDefinition Width="12"/>
-                                </Grid.ColumnDefinitions>
-                                <VisualStateManager.VisualStateGroups>
-                                    <VisualStateGroup x:Name="ActiveStates">
-                                        <VisualState x:Name="Active">
-                                            <VisualState.Setters>
-                                                <Setter Target="normalOutput.IsTextSelectionEnabled" Value="True"/>
-                                                <Setter Target="normalOutput.FontWeight" Value="SemiBold"/>
-                                            </VisualState.Setters>
-                                        </VisualState>
-                                        <VisualState x:Name="Normal"/>
-                                    </VisualStateGroup>
-                                </VisualStateManager.VisualStateGroups>
-                                <ScrollViewer x:Name="textContainer"
-                                              Grid.Column="1"
-                                              Padding="0,0,0,0"
-                                              Style="{ThemeResource ResultsScrollerSnapped}"
-                                              AutomationProperties.AccessibilityView="Raw">
-                                    <TextBlock x:Name="normalOutput"
-                                               Margin="{TemplateBinding DisplayMargin}"
-                                               HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                               VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                               Foreground="{TemplateBinding Foreground}"
-                                               FontSize="{TemplateBinding FontSize}"
-                                               FontWeight="Light"
-                                               AutomationProperties.AccessibilityView="Raw"
-                                               Text="{TemplateBinding DisplayValue}"
-                                               TextAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                               TextWrapping="NoWrap"/>
-                                </ScrollViewer>
-                                <HyperlinkButton x:Name="scrollLeft"
-                                                 Grid.Column="0"
-                                                 Width="20"
-                                                 MinWidth="20"
-                                                 MinHeight="24"
-                                                 Margin="-4,0,-4,0"
-                                                 Padding="0,-3,0,4"
-                                                 VerticalAlignment="Top"
-                                                 HorizontalContentAlignment="Center"
-                                                 VerticalContentAlignment="Center"
-                                                 Foreground="{ThemeResource SystemControlForegroundAccentBrush}"
-                                                 BorderThickness="0"
-                                                 Visibility="Collapsed">
-                                    <FontIcon x:Name="scrollLeftText"
-                                              FontFamily="{ThemeResource SymbolThemeFontFamily}"
-                                              FontSize="12"
-                                              Glyph="&#xE26C;"/>
-                                </HyperlinkButton>
-                                <HyperlinkButton x:Name="scrollRight"
-                                                 Grid.Column="2"
-                                                 Width="20"
-                                                 MinWidth="20"
-                                                 MinHeight="24"
-                                                 Margin="-4,0,-4,0"
-                                                 Padding="0,-3,0,4"
-                                                 VerticalAlignment="Top"
-                                                 HorizontalContentAlignment="Center"
-                                                 VerticalContentAlignment="Center"
-                                                 Foreground="{ThemeResource SystemControlForegroundAccentBrush}"
-                                                 BorderThickness="0"
-                                                 Visibility="Collapsed">
-                                    <FontIcon x:Name="scrollRightText"
-                                              FontFamily="{ThemeResource SymbolThemeFontFamily}"
-                                              FontSize="12"
-                                              Glyph="&#xE26B;"/>
-                                </HyperlinkButton>
-                            </Grid>
-                        </ControlTemplate>
-                    </Setter.Value>
-                </Setter>
-            </Style>
-            <Style x:Key="CalculationResultStyleS" TargetType="Controls:CalculationResult">
-                <Setter Property="Background" Value="Transparent"/>
-                <Setter Property="Foreground" Value="{ThemeResource SystemControlPageTextBaseHighBrush}"/>
-                <Setter Property="HorizontalAlignment" Value="Stretch"/>
-                <Setter Property="VerticalAlignment" Value="Stretch"/>
-                <Setter Property="HorizontalContentAlignment" Value="Right"/>
-                <Setter Property="VerticalContentAlignment" Value="Top"/>
-                <Setter Property="MinHeight" Value="12"/>
-                <Setter Property="IsTextScaleFactorEnabled" Value="False"/>
-                <Setter Property="UseSystemFocusVisuals" Value="True"/>
-                <Setter Property="Template">
-                    <Setter.Value>
-                        <ControlTemplate TargetType="Controls:CalculationResult">
-                            <Grid x:Name="border" Background="{TemplateBinding Background}">
-                                <Grid.ColumnDefinitions>
-                                    <ColumnDefinition Width="12"/>
-                                    <ColumnDefinition/>
-                                    <ColumnDefinition Width="12"/>
-                                </Grid.ColumnDefinitions>
-                                <VisualStateManager.VisualStateGroups>
-                                    <VisualStateGroup x:Name="ActiveStates">
-                                        <VisualState x:Name="Active">
-                                            <VisualState.Setters>
-                                                <Setter Target="normalOutput.FontWeight" Value="SemiBold"/>
-                                                <Setter Target="normalOutput.IsTextSelectionEnabled" Value="True"/>
-                                            </VisualState.Setters>
-                                        </VisualState>
-                                        <VisualState x:Name="Normal"/>
-                                    </VisualStateGroup>
-                                </VisualStateManager.VisualStateGroups>
-                                <ScrollViewer x:Name="textContainer"
-                                              Grid.Column="1"
-                                              Padding="0,0,0,0"
-                                              Style="{ThemeResource ResultsScrollerSnapped}"
-                                              AutomationProperties.AccessibilityView="Raw">
-                                    <TextBlock x:Name="normalOutput"
-                                               Margin="{TemplateBinding DisplayMargin}"
-                                               HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                               VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                               Foreground="{TemplateBinding Foreground}"
-                                               FontSize="{TemplateBinding FontSize}"
-                                               FontWeight="Light"
-                                               AutomationProperties.AccessibilityView="Raw"
-                                               Text="{TemplateBinding DisplayValue}"
-                                               TextAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                               TextWrapping="NoWrap"/>
-                                </ScrollViewer>
-                                <HyperlinkButton x:Name="scrollLeft"
-                                                 Grid.Column="0"
-                                                 Width="20"
-                                                 MinWidth="20"
-                                                 MinHeight="24"
-                                                 Margin="-4,0,-4,0"
-                                                 Padding="0,-3,0,4"
-                                                 VerticalAlignment="Top"
-                                                 HorizontalContentAlignment="Center"
-                                                 VerticalContentAlignment="Center"
-                                                 Foreground="{ThemeResource SystemControlForegroundAccentBrush}"
-                                                 BorderThickness="0"
-                                                 Visibility="Collapsed">
-                                    <FontIcon x:Name="scrollLeftText"
-                                              FontFamily="{ThemeResource SymbolThemeFontFamily}"
-                                              FontSize="12"
-                                              Glyph="&#xE26C;"/>
-                                </HyperlinkButton>
-                                <HyperlinkButton x:Name="scrollRight"
-                                                 Grid.Column="2"
-                                                 Width="20"
-                                                 MinWidth="20"
-                                                 MinHeight="24"
-                                                 Margin="-4,0,-4,0"
-                                                 Padding="0,-3,0,4"
-                                                 VerticalAlignment="Top"
-                                                 HorizontalContentAlignment="Center"
-                                                 VerticalContentAlignment="Center"
-                                                 Foreground="{ThemeResource SystemControlForegroundAccentBrush}"
-                                                 BorderThickness="0"
-                                                 Visibility="Collapsed">
-                                    <FontIcon x:Name="scrollRightText"
-                                              FontFamily="{ThemeResource SymbolThemeFontFamily}"
-                                              FontSize="12"
-                                              Glyph="&#xE26B;"/>
-                                </HyperlinkButton>
-                            </Grid>
-                        </ControlTemplate>
-                    </Setter.Value>
-                </Setter>
-            </Style>
 
             <Style x:Key="CaptionButtonStyle" TargetType="Button">
                 <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
diff --git a/src/Calculator/Controls/CalculationResult.cpp b/src/Calculator/Controls/CalculationResult.cpp
index f12daff..76bb8e0 100644
--- a/src/Calculator/Controls/CalculationResult.cpp
+++ b/src/Calculator/Controls/CalculationResult.cpp
@@ -28,6 +28,7 @@ using namespace std;
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, IsActive);
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, AccentColor);
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, MinFontSize);
+DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, MaxFontSize);
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, DisplayMargin);
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, MaxExpressionHistoryCharacters);
 DEPENDENCY_PROPERTY_INITIALIZATION(CalculationResult, ExpressionVisibility);
@@ -50,7 +51,6 @@ StringReference CalculationResult::s_FocusedState(L"Focused");
 StringReference CalculationResult::s_UnfocusedState(L"Unfocused");
 
 CalculationResult::CalculationResult():
-    m_startingFontSize(0.0),
     m_isScalingText(false),
     m_haveCalculatedMax(false)
 {
@@ -95,7 +95,6 @@ void CalculationResult::OnApplyTemplate()
         if (m_textBlock)
         {
             m_textBlock->Visibility = ::Visibility::Visible;
-            m_startingFontSize = m_textBlock->FontSize;
         }
     }
     UpdateAllState();
@@ -143,6 +142,16 @@ void CalculationResult::OnDisplayValuePropertyChanged(String^ /*oldValue*/, Stri
     UpdateTextState();
 }
 
+void CalculationResult::OnMinFontSizePropertyChanged(double /*oldValue*/, double /*newValue*/)
+{
+    UpdateTextState();
+}
+
+void CalculationResult::OnMaxFontSizePropertyChanged(double /*oldValue*/, double /*newValue*/)
+{
+    UpdateTextState();
+}
+
 void CalculationResult::OnIsInErrorPropertyChanged(bool /*oldValue*/, bool newValue)
 {
     // We need to have a good template for this to work
@@ -212,7 +221,7 @@ void CalculationResult::UpdateTextState()
         {
             fontSizeChange = min<double>(max<double>(floor(WIDTHTOFONTSCALAR * widthDiff) - WIDTHTOFONTOFFSET, INCREMENTOFFSET), MAXFONTINCREMENT);
         }
-        if (m_textBlock->ActualWidth < containerSize && abs(m_textBlock->FontSize - m_startingFontSize) > FONTTOLERANCE && !m_haveCalculatedMax)
+        if (m_textBlock->ActualWidth < containerSize && abs(m_textBlock->FontSize - MaxFontSize) > FONTTOLERANCE && !m_haveCalculatedMax)
         {
             ModifyFontAndMargin(m_textBlock, fontSizeChange);
             m_textBlock->InvalidateArrange();
@@ -228,7 +237,7 @@ void CalculationResult::UpdateTextState()
             m_textBlock->InvalidateArrange();
             return;
         }
-        assert(m_textBlock->FontSize >= MinFontSize && m_textBlock->FontSize <= m_startingFontSize);
+        assert(m_textBlock->FontSize >= MinFontSize && m_textBlock->FontSize <= MaxFontSize);
         m_isScalingText = false;
         if (IsOperatorCommand)
         {
@@ -361,24 +370,15 @@ void CalculationResult::ModifyFontAndMargin(TextBlock^ textBox, double fontChang
 {
     double cur = textBox->FontSize;
     double newFontSize = 0.0;
-    Thickness t = textBox->Margin;
     double scaleFactor = SCALEFACTOR;
     if (m_textContainer->ActualHeight <= HEIGHTCUTOFF)
     {
         scaleFactor = SMALLHEIGHTSCALEFACTOR;
     }
-    if (fontChange < 0)
-    {
-        newFontSize = max(cur + fontChange, MinFontSize);
-        t.Bottom += scaleFactor * abs(cur - newFontSize);
-    }
-    else
-    {
-        newFontSize = min(cur + fontChange, m_startingFontSize);
-        t.Bottom -= scaleFactor * abs(cur - newFontSize);
-    }
+
+    newFontSize = min(max(cur + fontChange, MinFontSize), MaxFontSize);
+    m_textContainer->Padding = Thickness(0, 0, 0, scaleFactor * abs(cur - newFontSize));
     textBox->FontSize = newFontSize;
-    textBox->Margin = t;
 }
 
 void CalculationResult::UpdateAllState()
diff --git a/src/Calculator/Controls/CalculationResult.h b/src/Calculator/Controls/CalculationResult.h
index 3e059a2..662ff55 100644
--- a/src/Calculator/Controls/CalculationResult.h
+++ b/src/Calculator/Controls/CalculationResult.h
@@ -19,7 +19,8 @@ namespace CalculatorApp
             DEPENDENCY_PROPERTY_OWNER(CalculationResult);
 
             DEPENDENCY_PROPERTY(Windows::UI::Xaml::Visibility, ExpressionVisibility);
-            DEPENDENCY_PROPERTY(double, MinFontSize);
+            DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(double, MinFontSize, 0.0);
+            DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(double, MaxFontSize, 30.0);
             DEPENDENCY_PROPERTY(Windows::UI::Xaml::Thickness, DisplayMargin);
             DEPENDENCY_PROPERTY(int, MaxExpressionHistoryCharacters);
             DEPENDENCY_PROPERTY_WITH_CALLBACK(bool, IsActive);
@@ -52,6 +53,8 @@ namespace CalculatorApp
             void OnAccentColorPropertyChanged(Windows::UI::Xaml::Media::Brush^ oldValue, Windows::UI::Xaml::Media::Brush^ newValue);
             void OnDisplayValuePropertyChanged(Platform::String^ oldValue, Platform::String^ newValue);
             void OnIsInErrorPropertyChanged(bool oldValue, bool newValue);
+            void OnMinFontSizePropertyChanged(double oldValue, double newValue);
+            void OnMaxFontSizePropertyChanged(double oldValue, double newValue);
             void TextContainerSizeChanged(Object^ sender, Windows::UI::Xaml::SizeChangedEventArgs^ e);
             void OnTextContainerLayoutUpdated(Object^ sender, Object^ e);
             void UpdateVisualState();
@@ -74,7 +77,6 @@ namespace CalculatorApp
             Windows::UI::Xaml::Controls::TextBlock^ m_textBlock;
             Windows::UI::Xaml::Controls::HyperlinkButton^ m_scrollLeft;
             Windows::UI::Xaml::Controls::HyperlinkButton^ m_scrollRight;
-            double m_startingFontSize;
             double scrollRatio = 0.7;
             bool m_isScalingText;
             bool m_haveCalculatedMax;
diff --git a/src/Calculator/Views/Calculator.xaml b/src/Calculator/Views/Calculator.xaml
index 01164b8..0ceec73 100644
--- a/src/Calculator/Views/Calculator.xaml
+++ b/src/Calculator/Views/Calculator.xaml
@@ -255,48 +255,17 @@
         </Style>
 
         <!-- Calculation Result Styles -->
-
-        <Style x:Key="ResultsStyleL"
-               x:Name="ResultsStyleL"
-               BasedOn="{StaticResource CalculationResultStyleL}"
+        <Style x:Key="ResultsStyle"
+               BasedOn="{StaticResource CalculationResultStyle}"
                TargetType="controls:CalculationResult">
             <Setter Property="HorizontalContentAlignment" Value="Right"/>
             <Setter Property="VerticalContentAlignment" Value="Top"/>
-            <Setter Property="FontSize" Value="{StaticResource CalcResultFontSizeL}"/>
-            <Setter Property="MinFontSize" Value="12"/>
-            <Setter Property="IsActive" Value="True"/>
             <Setter Property="DisplayMargin" Value="0,0,0,0"/>
-            <Setter Property="MaxExpressionHistoryCharacters" Value="51"/>
-        </Style>
-
-        <Style x:Key="ResultsStyleM"
-               x:Name="ResultsStyleM"
-               BasedOn="{StaticResource CalculationResultStyleM}"
-               TargetType="controls:CalculationResult">
-            <Setter Property="HorizontalContentAlignment" Value="Right"/>
-            <Setter Property="VerticalContentAlignment" Value="Top"/>
-            <Setter Property="FontSize" Value="{StaticResource CalcResultFontSizeM}"/>
-            <Setter Property="MinFontSize" Value="12"/>
             <Setter Property="IsActive" Value="True"/>
-            <Setter Property="DisplayMargin" Value="0,0,0,0"/>
-            <Setter Property="MaxExpressionHistoryCharacters" Value="30"/>
-        </Style>
-
-        <Style x:Key="ResultsStyleS"
-               x:Name="ResultsStyleS"
-               BasedOn="{StaticResource CalculationResultStyleS}"
-               TargetType="controls:CalculationResult">
-            <Setter Property="HorizontalContentAlignment" Value="Right"/>
-            <Setter Property="VerticalContentAlignment" Value="Top"/>
-            <Setter Property="FontSize" Value="{StaticResource CalcResultFontSizeS}"/>
             <Setter Property="MinFontSize" Value="12"/>
-            <Setter Property="IsActive" Value="True"/>
-            <Setter Property="DisplayMargin" Value="0,0,0,0"/>
-            <Setter Property="MaxExpressionHistoryCharacters" Value="30"/>
         </Style>
 
         <!-- Button Styles -->
-
         <Style x:Key="ScrollButtonStyle" TargetType="Button">
             <Setter Property="BorderThickness" Value="0"/>
             <Setter Property="Padding" Value="0,0,0,0"/>
@@ -585,25 +554,34 @@
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="800"/>
                     </VisualState.StateTriggers>
-                    <Storyboard Completed="OnResultsLayoutChanged"/>
+                    <VisualState.Setters>
+                        <Setter Target="Results.MaxFontSize" Value="72"/>
+                        <Setter Target="Results.MaxExpressionHistoryCharacters" Value="51"/>
+                        <Setter Target="RowResult.MinHeight" Value="108"/>
+                        <Setter Target="RowResult.Height" Value="72*"/>
+                    </VisualState.Setters>
                 </VisualState>
-                <VisualState x:Name="ResultsProgM">
+                <VisualState x:Name="ResultsM">
                     <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="640"/>
+                        <AdaptiveTrigger x:Name="ResultsMVisualStateTrigger" MinWindowHeight="640"/>
                     </VisualState.StateTriggers>
-                    <Storyboard Completed="OnResultsLayoutChanged"/>
-                </VisualState>
-                <VisualState x:Name="ResultsSciM">
-                    <VisualState.StateTriggers>
-                        <AdaptiveTrigger MinWindowHeight="544"/>
-                    </VisualState.StateTriggers>
-                    <Storyboard Completed="OnResultsLayoutChanged"/>
+                    <VisualState.Setters>
+                        <Setter Target="Results.MaxFontSize" Value="46"/>
+                        <Setter Target="Results.MaxExpressionHistoryCharacters" Value="30"/>
+                        <Setter Target="RowResult.MinHeight" Value="72"/>
+                        <Setter Target="RowResult.Height" Value="72*"/>
+                    </VisualState.Setters>
                 </VisualState>
                 <VisualState x:Name="ResultsS">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="0"/>
                     </VisualState.StateTriggers>
-                    <Storyboard Completed="OnResultsLayoutChanged"/>
+                    <VisualState.Setters>
+                        <Setter Target="Results.MaxFontSize" Value="26"/>
+                        <Setter Target="Results.MaxExpressionHistoryCharacters" Value="30"/>
+                        <Setter Target="RowResult.MinHeight" Value="42"/>
+                        <Setter Target="RowResult.Height" Value="42*"/>
+                    </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
@@ -630,7 +608,7 @@
                                         x:Uid="CalculatorResults"
                                         Grid.Row="2"
                                         Margin="0,0,0,0"
-                                        Style="{ThemeResource ResultsStyleM}"
+                                        Style="{ThemeResource ResultsStyle}"
                                         AutomationProperties.AutomationId="CalculatorResults"
                                         AutomationProperties.HeadingLevel="Level1"
                                         AutomationProperties.Name="{x:Bind Model.CalculationResultAutomationName, Mode=OneWay}"
diff --git a/src/Calculator/Views/Calculator.xaml.cpp b/src/Calculator/Views/Calculator.xaml.cpp
index fa08ba5..30e25c2 100644
--- a/src/Calculator/Views/Calculator.xaml.cpp
+++ b/src/Calculator/Views/Calculator.xaml.cpp
@@ -185,16 +185,19 @@ void Calculator::UpdateViewState()
     {
         state = L"Programmer";
         Model->IsDecimalEnabled = false;
+        ResultsMVisualStateTrigger->MinWindowHeight = 640;
     }
     else if (IsScientific)
     {
         state = L"Scientific";
         Model->IsDecimalEnabled = true;
+        ResultsMVisualStateTrigger->MinWindowHeight = 544;
     }
     else
     {
         state = L"Standard";
         Model->IsDecimalEnabled = true;
+        ResultsMVisualStateTrigger->MinWindowHeight = 1;
     }
 
     CloseHistoryFlyout();
@@ -203,32 +206,6 @@ void Calculator::UpdateViewState()
     VisualStateManager::GoToState(this, ref new String(state.c_str()), true/*useTransitions*/);
 }
 
-void Calculator::SetResultStyles()
-{
-    CoreWindow^ window = CoreWindow::GetForCurrentThread();
-    if (window)
-    {
-        float curHeight = window->Bounds.Height;
-        if (curHeight >= 800)
-        {
-            Results->Style = ResultsStyleL;
-            RowResult->MinHeight = 108;
-            RowResult->Height = GridLength(72, GridUnitType::Star);
-        }
-        else if ((IsProgrammer && curHeight >= 640) || (IsScientific && curHeight >= 544) || IsStandard)
-        {
-            Results->Style = ResultsStyleM;
-            RowResult->MinHeight = 72;
-            RowResult->Height = GridLength(72, GridUnitType::Star);
-        }
-        else
-        {
-            Results->Style = ResultsStyleS;
-            RowResult->MinHeight = 42;
-            RowResult->Height = GridLength(42, GridUnitType::Star);
-        }
-    }
-}
 
 void Calculator::AnimateCalculator(bool resultAnimate)
 {
@@ -273,7 +250,6 @@ void Calculator::OnContextCanceled(UIElement^ sender, RoutedEventArgs^ e)
 
 void Calculator::OnLayoutStateChanged(_In_ Object^ sender, _In_ Object^ e)
 {
-    UpdateViewState();
     UpdatePanelViewState();
 }
 
@@ -357,7 +333,6 @@ void Calculator::OnStoryboardCompleted(_In_ Object^ sender, _In_ Object^ e)
             AnimateWithoutResult->Begin();
         }
     }
-    SetResultStyles();
 }
 
 void Calculator::EnsureScientific()
@@ -492,7 +467,7 @@ void Calculator::OnHistoryItemClicked(_In_ HistoryItemViewModel^ e)
     Model->SetExpressionDisplay(e->GetTokens(), e->GetCommands());
     Model->SetPrimaryDisplay(e->Result->Data(), false);
     Model->IsFToEEnabled = false;
-   
+
     TraceLogger::GetInstance().LogHistoryItemLoadEnd(tokenSize);
     CloseHistoryFlyout();
     this->Focus(::FocusState::Programmatic);
@@ -658,7 +633,6 @@ void Calculator::EnableMemoryControls(bool enable)
 void Calculator::EnableControls(bool enable)
 {
     OpsPanel->IsEnabled = enable;
-    
     EnableMemoryControls(enable);
 }
 
@@ -724,11 +698,6 @@ void Calculator::DockPanelTapped(_In_ TappedRoutedEventArgs^ e)
     m_IsLastFlyoutHistory = false;
 }
 
-void Calculator::OnResultsLayoutChanged(_In_ Object^ sender, _In_ Object^ e)
-{
-    SetResultStyles();
-}
-
 void Calculator::UnregisterEventHandlers()
 {
     expressionText->UnregisterEventHandlers();
diff --git a/src/Calculator/Views/Calculator.xaml.h b/src/Calculator/Views/Calculator.xaml.h
index 3ec3fea..5ec5324 100644
--- a/src/Calculator/Views/Calculator.xaml.h
+++ b/src/Calculator/Views/Calculator.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.
 
 #pragma once
@@ -133,8 +133,6 @@ namespace CalculatorApp
         void expressionContainer_LayoutUpdated(_In_ Platform::Object^ sender, _In_ Platform::Object^ e);
         bool IsValidRegularExpression(std::wstring str);
         void DockPanelTapped(_In_ Windows::UI::Xaml::Input::TappedRoutedEventArgs^ e);
-        void OnResultsLayoutChanged(_In_ Platform::Object^ sender, _In_ Platform::Object^ e);
-        void SetResultStyles();
         void OnErrorLayoutCompleted(_In_ Platform::Object^ sender, _In_ Platform::Object^ e);
         void OnHistoryAccessKeyInvoked(_In_ Windows::UI::Xaml::UIElement^ sender, _In_ Windows::UI::Xaml::Input::AccessKeyInvokedEventArgs^ args);
         void OnMemoryAccessKeyInvoked(_In_ Windows::UI::Xaml::UIElement^ sender, _In_ Windows::UI::Xaml::Input::AccessKeyInvokedEventArgs^ args);
diff --git a/src/Calculator/Views/UnitConverter.xaml b/src/Calculator/Views/UnitConverter.xaml
index e21dd50..71e1137 100644
--- a/src/Calculator/Views/UnitConverter.xaml
+++ b/src/Calculator/Views/UnitConverter.xaml
@@ -1,4 +1,4 @@
-<UserControl x:Class="CalculatorApp.UnitConverter"
+<UserControl x:Class="CalculatorApp.UnitConverter"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:automation="using:CalculatorApp.Common.Automation"
@@ -180,46 +180,30 @@
             </Setter>
         </Style>
 
-        <Style x:Key="ValueLargeStyle"
-               BasedOn="{StaticResource CalculationResultStyleL}"
+        <Style x:Key="ValueBaseStyle"
+               BasedOn="{StaticResource CalculationResultStyle}"
                TargetType="controls:CalculationResult">
             <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundTransparentBrush}"/>
             <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
             <Setter Property="HorizontalContentAlignment" Value="Left"/>
             <Setter Property="VerticalContentAlignment" Value="Bottom"/>
-            <Setter Property="FontSize" Value="46"/>
-            <Setter Property="MinFontSize" Value="{ThemeResource BodyFontSize}"/>
             <Setter Property="FontWeight" Value="Light"/>
+            <Setter Property="MinFontSize" Value="{ThemeResource BodyFontSize}"/>
+        </Style>
+        <Style x:Key="ValueLargeStyle"
+               BasedOn="{StaticResource ValueBaseStyle}"
+               TargetType="controls:CalculationResult">
+            <Setter Property="MaxFontSize" Value="46"/>
             <Setter Property="Margin" Value="-2,0,0,0"/>
             <Setter Property="DisplayMargin" Value="0,0,0,12"/>
         </Style>
         <Style x:Key="ValueMediumStyle"
-               BasedOn="{StaticResource CalculationResultStyleM}"
+               BasedOn="{StaticResource ValueBaseStyle}"
                TargetType="controls:CalculationResult">
-            <Setter Property="FontSize" Value="34"/>
-            <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundTransparentBrush}"/>
-            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
-            <Setter Property="MinFontSize" Value="{ThemeResource BodyFontSize}"/>
-            <Setter Property="FontWeight" Value="Light"/>
-            <Setter Property="HorizontalContentAlignment" Value="Left"/>
-            <Setter Property="VerticalContentAlignment" Value="Bottom"/>
+            <Setter Property="MaxFontSize" Value="34"/>
             <Setter Property="Margin" Value="0,0,0,0"/>
             <Setter Property="DisplayMargin" Value="0,0,0,4"/>
         </Style>
-        <Style x:Key="ValueSmallStyle"
-               BasedOn="{StaticResource CalculationResultStyleS}"
-               TargetType="controls:CalculationResult">
-            <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundTransparentBrush}"/>
-            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
-            <Setter Property="FontSize" Value="24"/>
-            <Setter Property="MinFontSize" Value="{ThemeResource BodyFontSize}"/>
-            <Setter Property="FontWeight" Value="Light"/>
-            <Setter Property="HorizontalContentAlignment" Value="Left"/>
-            <Setter Property="VerticalContentAlignment" Value="Bottom"/>
-            <Setter Property="Margin" Value="0,0,0,0"/>
-            <Setter Property="DisplayMargin" Value="0,0,0,4"/>
-        </Style>
-
         <Style x:Key="CurrencySymbolBaseStyle" TargetType="TextBlock">
             <Setter Property="FontWeight" Value="Light"/>
             <Setter Property="HorizontalAlignment" Value="Left"/>