Always-on-Top mode implemented (#579)

docs/ManualTests.md

@@ -54,6 +54,59 @@ Steps:
 2. Select “miles” as the unit type in the output field 
 *Expected: The output starts with is “3.106856”*
 
+### Always-on-Top
+
+**Test 1**
+Steps:
+1. Launch the "Calculator" app and navigate to "Standard" Calculator
+*Expected: Always-on-Top button's tooltip says "Keep on top"*
+2. Click the Always-on-Top button
+*Expected: Always-on-Top button's tooltip now says "Back to full view"*
+3. Launch the "Notepad" app and put it in full-screen mode
+*Expected: Calculator is still on top of Notepad and in Always-on-Top mode*
+
+**Test 2**
+Steps: 
+1. Launch the "Calculator" app and from "Standard" Calculator, input “3”, “+”, “3” (do not press “Enter”)
+2. Tab over the Always-on-Top button and press "Enter" on the keyboard
+*Expected: The application title, hamburger menu, calculator type title, calculation expression (the secondary line above the main display), history button and memory buttons are no longer visible. The main display shows "3"*
+2. Press “Enter”
+*Expected: The main display shows "6"*
+3. Press "Ctrl-H" on the keyboard
+*Expected: Nothing happens (history keyboard shortcuts are disabled)*
+4. Press "Ctrl-P" on the keyboard, then tab over the Always-on-Top button and press "Enter" on the keyboard again
+5. Open the Memory panel
+*Expected: Nothing is stored in memory (memory keyboard shortcuts are disabled in Always-on-Top mode) and "6" is in history*
+
+**Test 3**
+Steps: 
+1. Launch the "Calculator" app and from "Standard" Calculator, click the Always-on-Top button
+2. Resize the window horizontally
+*Expected: The buttons automatically expand or shrink to fit the available screen size*
+3. Resize the window vertically
+*Expected: The buttons automatically expand or shrink to fit the available screen size and the percent, square-root, squared and reciprocal buttons disappear when the screen height is small*
+4. Click the Always-on-Top button again
+*Expected: Calculator is in Standard mode and the original window layout from before Step 1 is restored*
+5. Click the Always-on-Top button again
+*Expected: Calculator is in Always-on-Top mode and the window size from after Step 3 is restored*
+6. Close the "Calculator" app
+7. Launch the "Calculator" app again and click the Always-on-Top button
+*Expected: The window size from right before closing from Always-on-Top mode (ie. after Step 5) is restored*
+
+**Test 4**
+Steps:
+1. Launch the "Calculator" app and from "Standard" Calculator, click the Always-on-Top button
+2. Input "/", "0", “Enter” on the keyboard
+*Expected: "Result is undefined" is displayed in the system default app language*
+3. Click the Always-on-Top button again
+*Expected: Calculator is in Standard mode and all operator (except for "CE", "C", "Delete" and "=") and memory buttons are disabled
+
+**Test 5**
+Steps:
+1. Launch the "Calculator" app and navigate to "Scientific" Calculator
+*Expected: The Always-on-Top button is hidden*
+2. Navigate to "Standard" Calculator
+*Expected: The Always-on-Top button is visible*
 
 ## Basic Verification Tests
 
@@ -278,7 +331,7 @@ Steps:
 Steps:
 1.	Launch the "Calculator" app.
 
-    For All Applicable Modes verify the following:
+    For All Applicable Modes verify the following (note: only 11-15 and 20 work in Always-on-Top mode):
 2.	Press **Alt +1** to Enter "Standard" mode
 *Expected: Move to "Standard" screen.*
 3.	Press **Alt +2** to Enter "Scientific" mode
@@ -353,3 +406,30 @@ Steps:
 61.	Press **|** to Select 'Or'
 62.	Press **~** to Select 'Not'
 63.	Press **&** to Select 'And'
+
+## Localization Tests
+
+### Always-on-Top
+
+**Test 1**
+Steps:
+1. Change the system default app language to Arabic
+2. Launch the "Calculator" app and from "Standard" Calculator, click the Always-on-Top button
+*Expected: UI/Menu is localized (for example, the title bar buttons is in right-to-left order)*
+3. Input "/", "0", “Enter” on the keyboard
+*Expected: Error message is in Arabic*
+
+## Ease of Access Tests
+
+### Always-on-Top
+
+**Test 1**
+Steps:
+1. Open the "Narrator" app
+2. Launch the "Calculator" app and from "Standard" Calculator, click the Always-on-Top button
+3. Tab over the Always-on-Top button
+*Expected: Narrator reads the localized version of "Back to full view"*
+4. Tab over the main results field
+*Expected: Narrator reads the localized version of exactly what's displayed (ie. "0")*
+5. Tab over the rest of the UI elements
+*Expected: Narrator reads the localized version of the UI elements' contents*

src/CalcViewModel/ApplicationViewModel.cpp

@@ -31,6 +31,8 @@ using namespace Windows::UI::Xaml::Controls;
 using namespace Windows::UI::Xaml::Data;
 using namespace Windows::UI::Xaml::Input;
 using namespace Windows::UI::Xaml::Media;
+using namespace Windows::Foundation;
+using namespace Concurrency;
 
 namespace
 {
@@ -55,6 +57,7 @@ void ApplicationViewModel::Mode::set(ViewMode value)
     {
         PreviousMode = m_mode;
         m_mode = value;
+        SetDisplayNormalAlwaysOnTopOption();
         OnModeChanged();
         RaisePropertyChanged(ModePropertyName);
     }
@@ -204,3 +207,60 @@ void ApplicationViewModel::SetMenuCategories()
     // property setter logic.
     Categories = NavCategoryGroup::CreateMenuOptions();
 }
+
+void ApplicationViewModel::ToggleAlwaysOnTop(float width, float height)
+{
+    HandleToggleAlwaysOnTop(width, height);
+}
+
+task<void> ApplicationViewModel::HandleToggleAlwaysOnTop(float width, float height)
+{
+    if (ApplicationView::GetForCurrentView()->ViewMode == ApplicationViewMode::CompactOverlay)
+    {
+        ApplicationDataContainer ^ localSettings = ApplicationData::Current->LocalSettings;
+        localSettings->Values->Insert(WidthLocalSettings, width);
+        localSettings->Values->Insert(HeightLocalSettings, height);
+
+        bool success = co_await ApplicationView::GetForCurrentView()->TryEnterViewModeAsync(ApplicationViewMode::Default);
+        CalculatorViewModel->AreHistoryShortcutsEnabled = success;
+        CalculatorViewModel->HistoryVM->AreHistoryShortcutsEnabled = success;
+        CalculatorViewModel->IsAlwaysOnTop = !success;
+        IsAlwaysOnTop = !success;
+    }
+    else
+    {
+        ApplicationDataContainer ^ localSettings = ApplicationData::Current->LocalSettings;
+        ViewModePreferences ^ compactOptions = ViewModePreferences::CreateDefault(ApplicationViewMode::CompactOverlay);
+        if (!localSettings->Values->GetView()->HasKey(LaunchedLocalSettings))
+        {
+            compactOptions->CustomSize = Size(320, 394);
+            localSettings->Values->Insert(LaunchedLocalSettings, true);
+        }
+        else
+        {
+            if (localSettings->Values->GetView()->HasKey(WidthLocalSettings) && localSettings->Values->GetView()->HasKey(HeightLocalSettings))
+            {
+                float oldWidth = safe_cast<IPropertyValue ^>(localSettings->Values->GetView()->Lookup(WidthLocalSettings))->GetSingle();
+                float oldHeight = safe_cast<IPropertyValue ^>(localSettings->Values->GetView()->Lookup(HeightLocalSettings))->GetSingle();
+                compactOptions->CustomSize = Size(oldWidth, oldHeight);
+            }
+            else
+            {
+                compactOptions->CustomSize = Size(320, 394);
+            }
+        }
+
+        bool success = co_await ApplicationView::GetForCurrentView()->TryEnterViewModeAsync(ApplicationViewMode::CompactOverlay, compactOptions);
+        CalculatorViewModel->AreHistoryShortcutsEnabled = !success;
+        CalculatorViewModel->HistoryVM->AreHistoryShortcutsEnabled = !success;
+        CalculatorViewModel->IsAlwaysOnTop = success;
+        IsAlwaysOnTop = success;
+    }
+    SetDisplayNormalAlwaysOnTopOption();
+}
+
+void ApplicationViewModel::SetDisplayNormalAlwaysOnTopOption()
+{
+    DisplayNormalAlwaysOnTopOption =
+        m_mode == ViewMode::Standard && ApplicationView::GetForCurrentView()->IsViewModeSupported(ApplicationViewMode::CompactOverlay) && !IsAlwaysOnTop;
+}

src/CalcViewModel/ApplicationViewModel.h

@@ -25,6 +25,9 @@ namespace CalculatorApp
             OBSERVABLE_PROPERTY_RW(CalculatorApp::Common::ViewMode, PreviousMode);
             OBSERVABLE_NAMED_PROPERTY_RW(Platform::String ^, CategoryName);
 
+            // Indicates whether calculator is currently in standard mode _and_ supports CompactOverlay _and_ is not in Always-on-Top mode
+            OBSERVABLE_PROPERTY_RW(bool, DisplayNormalAlwaysOnTopOption);
+
             COMMAND_FOR_METHOD(CopyCommand, ApplicationViewModel::OnCopyCommand);
             COMMAND_FOR_METHOD(PasteCommand, ApplicationViewModel::OnPasteCommand);
 
@@ -64,6 +67,48 @@ namespace CalculatorApp
                 }
             }
 
+            static property Platform::String ^ LaunchedLocalSettings
+            {
+                Platform::String ^ get()
+                {
+                    return Platform::StringReference(L"calculatorAlwaysOnTopLaunched");
+                }
+            }
+
+            static property Platform::String ^ WidthLocalSettings
+            {
+                Platform::String ^ get()
+                {
+                    return Platform::StringReference(L"calculatorAlwaysOnTopLastWidth");
+                }
+            }
+
+            static property Platform::String ^ HeightLocalSettings
+            {
+                Platform::String ^ get()
+                {
+                    return Platform::StringReference(L"calculatorAlwaysOnTopLastHeight");
+                }
+            }
+
+            property bool IsAlwaysOnTop
+            {
+                bool get()
+                {
+                    return m_isAlwaysOnTop;
+                }
+                void set(bool value)
+                {
+                    if (m_isAlwaysOnTop != value)
+                    {
+                        m_isAlwaysOnTop = value;
+                        RaisePropertyChanged(L"IsAlwaysOnTop");
+                    }
+                }
+            }
+
+            void ToggleAlwaysOnTop(float width, float height);
+
         private:
             bool TryRecoverFromNavigationModeFailure();
 
@@ -76,6 +121,10 @@ namespace CalculatorApp
 
             CalculatorApp::Common::ViewMode m_mode;
             Windows::Foundation::Collections::IObservableVector<CalculatorApp::Common::NavCategoryGroup ^> ^ m_categories;
+            Concurrency::task<void> HandleToggleAlwaysOnTop(float width, float height);
+            void SetDisplayNormalAlwaysOnTopOption();
+
+            bool m_isAlwaysOnTop;
         };
     }
 }

src/CalcViewModel/Common/KeyboardShortcutManager.cpp

@@ -668,10 +668,11 @@ void KeyboardShortcutManager::OnAcceleratorKeyActivated(CoreDispatcher ^, Accele
                     if (nullptr != vm)
                     {
                         ViewMode toMode = NavCategory::GetViewModeForVirtualKey(static_cast<MyVirtualKey>(key));
-                        if (NavCategory::IsValidViewMode(toMode))
+                        auto nvi = dynamic_cast<MUXC::NavigationViewItem ^>(menuItems->GetAt(NavCategory::GetFlatIndex(toMode)));
+                        if (nvi && nvi->IsEnabled && NavCategory::IsValidViewMode(toMode))
                         {
                             vm->Mode = toMode;
-                            navView->SelectedItem = menuItems->GetAt(NavCategory::GetFlatIndex(toMode));
+                            navView->SelectedItem = nvi;
                         }
                     }
                 }

src/CalcViewModel/Common/TraceLogger.cpp

@@ -117,7 +117,7 @@ namespace CalculatorApp
         return true;
     }
 
-    void TraceLogger::LogVisualStateChanged(ViewMode mode, wstring_view state) const
+    void TraceLogger::LogVisualStateChanged(ViewMode mode, wstring_view state, bool isAlwaysOnTop) const
     {
         if (!GetTraceLoggingProviderEnabled())
         {
@@ -128,6 +128,7 @@ namespace CalculatorApp
         fields.AddGuid(L"SessionGuid", sessionGuid);
         fields.AddString(L"CalcMode", NavCategory::GetFriendlyName(mode)->Data());
         fields.AddString(L"VisualState", state);
+        fields.AddBoolean(L"IsAlwaysOnTop", isAlwaysOnTop);
         fields.AddUInt64(PDT_PRIVACY_DATA_TAG, PDT_PRODUCT_AND_SERVICE_USAGE);
         LogLevel2Event(EVENT_NAME_VISUAL_STATE_CHANGED, fields);
     }

src/CalcViewModel/Common/TraceLogger.h

@@ -45,7 +45,7 @@ namespace CalculatorApp
         void LogDateCalculationModeUsed(bool AddSubtractMode);
         void UpdateWindowCount(size_t windowCount = 0);
         bool IsWindowIdInLog(int windowId);
-        void LogVisualStateChanged(CalculatorApp::Common::ViewMode mode, std::wstring_view state) const;
+        void LogVisualStateChanged(CalculatorApp::Common::ViewMode mode, std::wstring_view state, bool isAlwaysOnTop = false) const;
         void LogWindowCreated(CalculatorApp::Common::ViewMode mode, int windowId);
         void LogConverterInputReceived(CalculatorApp::Common::ViewMode mode) const;
         void LogNavBarOpened() const;

src/CalcViewModel/StandardCalculatorViewModel.cpp

@@ -35,6 +35,7 @@ namespace
     StringReference IsStandardPropertyName(L"IsStandard");
     StringReference IsScientificPropertyName(L"IsScientific");
     StringReference IsProgrammerPropertyName(L"IsProgrammer");
+    StringReference IsAlwaysOnTopPropertyName(L"IsAlwaysOnTop");
     StringReference DisplayValuePropertyName(L"DisplayValue");
     StringReference CalculationResultAutomationNamePropertyName(L"CalculationResultAutomationName");
     StringReference IsBitFlipCheckedPropertyName(L"IsBitFlipChecked");
@@ -202,7 +203,12 @@ void StandardCalculatorViewModel::SetPrimaryDisplay(_In_ wstring const& displayS
     // not match what the narrator is saying
     m_CalculationResultAutomationName = CalculateNarratorDisplayValue(displayStringValue, localizedDisplayStringValue, isError);
 
-    DisplayValue = localizedDisplayStringValue;
+    AreAlwaysOnTopResultsUpdated = false;
+    if (DisplayValue != localizedDisplayStringValue)
+    {
+        DisplayValue = localizedDisplayStringValue;
+        AreAlwaysOnTopResultsUpdated = true;
+    }
 
     IsInError = isError;
 
@@ -415,7 +421,7 @@ void StandardCalculatorViewModel::SetMemorizedNumbers(const vector<wstring>& new
             memorySlot->Value = Utils::LRO + ref new String(stringValue.c_str()) + Utils::PDF;
 
             MemorizedNumbers->InsertAt(0, memorySlot);
-            IsMemoryEmpty = false;
+            IsMemoryEmpty = IsAlwaysOnTop;
 
             // Update the slot position for the rest of the slots
             for (unsigned int i = 1; i < MemorizedNumbers->Size; i++)

src/CalcViewModel/StandardCalculatorViewModel.h

@@ -78,6 +78,7 @@ namespace CalculatorApp
             OBSERVABLE_PROPERTY_RW(bool, IsByteEnabled);
             OBSERVABLE_PROPERTY_RW(int, CurrentRadixType);
             OBSERVABLE_PROPERTY_RW(bool, AreTokensUpdated);
+            OBSERVABLE_PROPERTY_RW(bool, AreAlwaysOnTopResultsUpdated);
             OBSERVABLE_PROPERTY_RW(bool, AreHistoryShortcutsEnabled);
             OBSERVABLE_PROPERTY_RW(bool, AreProgrammerRadixOperatorsEnabled);
             OBSERVABLE_PROPERTY_RW(CalculatorApp::Common::Automation::NarratorAnnouncement ^, Announcement);
@@ -213,6 +214,22 @@ namespace CalculatorApp
                 }
             }
 
+            property bool IsAlwaysOnTop
+            {
+                bool get()
+                {
+                    return m_isAlwaysOnTop;
+                }
+                void set(bool value)
+                {
+                    if (m_isAlwaysOnTop != value)
+                    {
+                        m_isAlwaysOnTop = value;
+                        RaisePropertyChanged(L"IsAlwaysOnTop");
+                    }
+                }
+            }
+
             property bool IsEditingEnabled
             {
                 bool get()
@@ -406,6 +423,7 @@ namespace CalculatorApp
             bool m_isStandard;
             bool m_isScientific;
             bool m_isProgrammer;
+            bool m_isAlwaysOnTop;
             bool m_isBinaryBitFlippingEnabled;
             bool m_isBitFlipChecked;
             bool m_isShiftChecked;

src/CalcViewModel/pch.h

@@ -30,6 +30,7 @@
 #include <concrt.h>
 #include <regex>
 #include <iterator>
+#include <intsafe.h>
 // C++\WinRT Headers
 #include "winrt/base.h"
 #include "winrt/Windows.Foundation.Diagnostics.h"

src/Calculator/App.xaml

@@ -128,6 +128,8 @@
             <x:Double x:Key="CalcStandardOperatorCaptionSizeLarge">24</x:Double>
             <!-- Numpad Standard/Scientific in Fill/Full -->
             <x:Double x:Key="CalcStandardOperatorCaptionSize">20</x:Double>
+            <x:Double x:Key="CalcStandardOperatorCaptionSizeSmall">15</x:Double>
+            <x:Double x:Key="CalcStandardOperatorCaptionSizeTiny">12</x:Double>
             <!-- Standard Operators Standard/Scientific in Fill/Full -->
             <x:Double x:Key="CalcOperatorCaptionSize">15</x:Double>
 
@@ -210,11 +212,21 @@
                    TargetType="Controls:CalculatorButton">
                 <Setter Property="FontWeight" Value="SemiBold"/>
             </Style>
+            <Style x:Key="NumericButtonStyle10"
+                   BasedOn="{StaticResource NumericButtonStyle}"
+                   TargetType="Controls:CalculatorButton">
+                <Setter Property="FontSize" Value="10"/>
+            </Style>
             <Style x:Key="NumericButtonStyle12"
                    BasedOn="{StaticResource NumericButtonStyle}"
                    TargetType="Controls:CalculatorButton">
                 <Setter Property="FontSize" Value="12"/>
             </Style>
+            <Style x:Key="NumericButtonStyle16"
+                   BasedOn="{StaticResource NumericButtonStyle}"
+                   TargetType="Controls:CalculatorButton">
+                <Setter Property="FontSize" Value="16"/>
+            </Style>
             <Style x:Key="NumericButtonStyle18"
                    BasedOn="{StaticResource NumericButtonStyle}"
                    TargetType="Controls:CalculatorButton">

src/Calculator/App.xaml.cpp

@@ -404,27 +404,30 @@ void App::OnAppLaunch(IActivatedEventArgs ^ args, String ^ argument)
                     throw std::bad_exception();
                 }
             }
-            if (!Windows::Foundation::Metadata::ApiInformation::IsTypePresent("Windows.Phone.UI.Input.HardwareButtons"))
+            if (ApplicationView::GetForCurrentView()->ViewMode != ApplicationViewMode::CompactOverlay)
             {
-                // for tablet mode: since system view activation policy is disabled so do ShowAsStandaloneAsync if activationViewSwitcher exists in
+                if (!Windows::Foundation::Metadata::ApiInformation::IsTypePresent("Windows.Phone.UI.Input.HardwareButtons"))
-                // activationArgs
-                ActivationViewSwitcher ^ activationViewSwitcher;
-                auto activateEventArgs = dynamic_cast<IViewSwitcherProvider ^>(args);
-                if (activateEventArgs != nullptr)
                 {
-                    activationViewSwitcher = activateEventArgs->ViewSwitcher;
+                    // for tablet mode: since system view activation policy is disabled so do ShowAsStandaloneAsync if activationViewSwitcher exists in
-                }
+                    // activationArgs
-                if (activationViewSwitcher != nullptr)
+                    ActivationViewSwitcher ^ activationViewSwitcher;
-                {
+                    auto activateEventArgs = dynamic_cast<IViewSwitcherProvider ^>(args);
-                    auto viewId = safe_cast<IApplicationViewActivatedEventArgs ^>(args)->CurrentlyShownApplicationViewId;
+                    if (activateEventArgs != nullptr)
-                    if (viewId != 0)
                     {
-                        activationViewSwitcher->ShowAsStandaloneAsync(viewId);
+                        activationViewSwitcher = activateEventArgs->ViewSwitcher;
+                    }
+                    if (activationViewSwitcher != nullptr)
+                    {
+                        auto viewId = safe_cast<IApplicationViewActivatedEventArgs ^>(args)->CurrentlyShownApplicationViewId;
+                        if (viewId != 0)
+                        {
+                            activationViewSwitcher->ShowAsStandaloneAsync(viewId);
+                        }
                     }
                 }
+                // Ensure the current window is active
+                Window::Current->Activate();
             }
-            // Ensure the current window is active
-            Window::Current->Activate();
         }
     }
 }

src/Calculator/Controls/OverflowTextBlock.cpp

@@ -27,6 +27,9 @@ using namespace Windows::UI::Xaml::Navigation;
 DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, IsActive);
 DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, TextStyle);
 DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, TokensUpdated);
+DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, ColumnWidth);
+DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, ColumnHeight);
+DEPENDENCY_PROPERTY_INITIALIZATION(OverflowTextBlock, ScrollButtonFontSize);
 
 void OverflowTextBlock::OnApplyTemplate()
 {
@@ -64,6 +67,12 @@ void OverflowTextBlock::OnApplyTemplate()
         m_itemsControl = safe_cast<ItemsControl ^>(uiElement);
     }
 
+    uiElement = GetTemplateChild("EditableToken");
+    if (uiElement != nullptr)
+    {
+        m_editableToken = safe_cast<TextBlock ^>(uiElement);
+    }
+
     UpdateAllState();
 }
 
@@ -144,13 +153,25 @@ void OverflowTextBlock::OnScrollClick(_In_ Object ^ sender, _In_ RoutedEventArgs
 
 void OverflowTextBlock::UpdateScrollButtons()
 {
-    if (m_itemsControl == nullptr || m_expressionContainer == nullptr)
+    if (m_expressionContainer == nullptr)
     {
         return;
     }
 
+    double editableTokenWidth = 0;
+    if (m_editableToken != nullptr && m_editableToken->Visibility == ::Visibility::Visible)
+    {
+        editableTokenWidth = m_editableToken->ActualWidth;
+    }
+
+    double itemsControlWidth = 0;
+    if (m_itemsControl != nullptr && m_itemsControl->Visibility == ::Visibility::Visible)
+    {
+        itemsControlWidth = m_itemsControl->ActualWidth; 
+    }
+
     // When the width is smaller than the container, don't show any
-    if (m_itemsControl->ActualWidth <= m_expressionContainer->ActualWidth)
+    if (itemsControlWidth + editableTokenWidth <= m_expressionContainer->ActualWidth)
     {
         ShowHideScrollButtons(::Visibility::Collapsed, ::Visibility::Collapsed);
     }
@@ -161,7 +182,7 @@ void OverflowTextBlock::UpdateScrollButtons()
     {
         ShowHideScrollButtons(::Visibility::Visible, ::Visibility::Visible);
     }
-    // Width is larger than the container and left most part of the number is shown. Should be able to scroll left.
+    // Width is larger than the container and left most part of the number is shown. Should be able to scroll right.
     else if (m_expressionContainer->HorizontalOffset == 0)
     {
         ShowHideScrollButtons(::Visibility::Collapsed, ::Visibility::Visible);

src/Calculator/Controls/OverflowTextBlock.h

@@ -18,10 +18,14 @@ namespace CalculatorApp
             }
 
             DEPENDENCY_PROPERTY_OWNER(OverflowTextBlock);
-
             DEPENDENCY_PROPERTY_WITH_CALLBACK(bool, TokensUpdated);
             DEPENDENCY_PROPERTY(bool, IsActive);
             DEPENDENCY_PROPERTY(Windows::UI::Xaml::Style ^, TextStyle);
+            DEPENDENCY_PROPERTY(double, ColumnWidth);
+            DEPENDENCY_PROPERTY(double, ColumnHeight);
+            DEPENDENCY_PROPERTY(double, ScrollButtonFontSize);
+
+            void OnTokensUpdatedPropertyChanged(bool oldValue, bool newValue);
             void UpdateScrollButtons();
             void UnregisterEventHandlers();
 
@@ -34,7 +38,6 @@ namespace CalculatorApp
             void OnPointerEntered(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::Input::PointerRoutedEventArgs ^ e);
             void OnPointerExited(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::Input::PointerRoutedEventArgs ^ e);
             void ShowHideScrollButtons(Windows::UI::Xaml::Visibility vLeft, Windows::UI::Xaml::Visibility vRight);
-            void OnTokensUpdatedPropertyChanged(bool oldValue, bool newValue);
             void OnViewChanged(_In_opt_ Platform::Object ^ sender, _In_opt_ Windows::UI::Xaml::Controls::ScrollViewerViewChangedEventArgs ^ args);
 
             void UpdateVisualState();
@@ -47,6 +50,7 @@ namespace CalculatorApp
             bool m_scrollingLeft;
             bool m_scrollingRight;
             bool m_isAccessibilityViewControl;
+            Windows::UI::Xaml::Controls::TextBlock ^ m_editableToken;
             Windows::UI::Xaml::Controls::ItemsControl ^ m_itemsControl;
             Windows::UI::Xaml::Controls::ScrollViewer ^ m_expressionContainer;
             Windows::UI::Xaml::Controls::Button ^ m_scrollLeft;

src/Calculator/Resources/en-US/Resources.resw

@@ -825,6 +825,14 @@
     <value>Close memory flyout</value>
     <comment>This is the automation name and label for the memory button when the memory flyout is open.</comment>
   </data>
+  <data name="AlwaysOnTop_Enter" xml:space="preserve">
+    <value>Keep on top</value>
+    <comment>This is the tool tip automation name for the always-on-top button when out of always-on-top mode.</comment>
+  </data>
+  <data name="AlwaysOnTop_Exit" xml:space="preserve">
+    <value>Back to full view</value>
+    <comment>This is the tool tip automation name for the always-on-top button when in always-on-top mode.</comment>
+  </data>
   <data name="MemoryButton.[using:Windows.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
     <value>Memory</value>
     <comment>This is the tool tip automation name for the memory button.</comment>
@@ -957,6 +965,10 @@
     <value>Display is %1</value>
     <comment>{Locked="%1"}. Screen reader prompt for the Calculator results text block. %1 = Localized display value, e.g. "50".</comment>
   </data>
+  <data name="Format_CalculatorAlwaysOnTopResults" xml:space="preserve">
+    <value>Expression is %1, Current input is %2</value>
+    <comment>{Locked="%1","%2"}. Screen reader prompt for the Calculator always-on-top expression. %1 = Expression, e.g. "50 + 2 - 60 +", %2 = Localized display value, e.g. "50".</comment>
+  </data>
   <data name="Format_CalculatorResults_Decimal" xml:space="preserve">
     <value>Display is %1 point</value>
     <comment>{Locked="%1"}. Automation label for the calculator display in the specific case where the user has just pressed the decimal separator button. For example, the user wants to input "7.5".  When they have input "7." they will hear "Display is 7 point". "point" should be localized to the locale's appropriate decimal separator.</comment>
@@ -1469,6 +1481,22 @@
     <value>Categories DropDown</value>
     <comment>Screen reader prompt for the Categories dropdown field.</comment>
   </data>
+  <data name="EnterAlwaysOnTopButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Keep on top</value>
+    <comment>Screen reader prompt for the Always-on-Top button when in normal mode.</comment>
+  </data>
+  <data name="ExitAlwaysOnTopButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Back to full view</value>
+    <comment>Screen reader prompt for the Always-on-Top button when in Always-on-Top mode.</comment>
+  </data>
+  <data name="EnterAlwaysOnTopButton.[using:Windows.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
+    <value>Keep on top</value>
+    <comment>This is the tool tip automation name for the Always-on-Top button when in normal mode.</comment>
+  </data>
+  <data name="ExitAlwaysOnTopButton.[using:Windows.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
+    <value>Back to full view</value>
+    <comment>This is the tool tip automation name for the Always-on-Top button when in Always-on-Top mode.</comment>
+  </data>
   <data name="Format_ValueFrom" xml:space="preserve">
     <value>Convert from %1 %2</value>
     <comment>Screen reader prompt for the Unit Converter Value1 i.e. top number field. %1 = DisplayValue, %2 = Unit field localized name.</comment>

src/Calculator/Views/Calculator.xaml

@@ -34,8 +34,29 @@
                        Text="{x:Bind Token, Mode=OneWay}"/>
         </DataTemplate>
 
+        <DataTemplate x:Key="AlwaysOnTopOperand" x:DataType="common:DisplayExpressionToken">
+            <TextBlock Margin="2,0,0,0"
+                       Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
+                       IsTextScaleFactorEnabled="False"
+                       Text="{x:Bind Token, Mode=OneWay}"/>
+        </DataTemplate>
+
+        <DataTemplate x:Key="AlwaysOnTopOperator" x:DataType="common:DisplayExpressionToken">
+            <TextBlock Margin="2,0,0,0"
+                       Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
+                       IsTextScaleFactorEnabled="False"
+                       Text="{x:Bind Token, Mode=OneWay}"/>
+        </DataTemplate>
+
+        <DataTemplate x:Key="AlwaysOnTopSeparator" x:DataType="common:DisplayExpressionToken">
+            <TextBlock x:Name="MainText"
+                       IsTextScaleFactorEnabled="False"
+                       Text="{x:Bind Token, Mode=OneWay}"/>
+        </DataTemplate>
+
         <!-- TextBox Styles -->
-        <Style TargetType="controls:OverflowTextBlock">
+
+        <Style x:Key="NormalStyle" TargetType="controls:OverflowTextBlock">
             <Setter Property="HorizontalAlignment" Value="Stretch"/>
             <Setter Property="Template">
                 <Setter.Value>
@@ -93,6 +114,110 @@
             </Setter>
         </Style>
 
+        <Style x:Key="AlwaysOnTopStyleS" TargetType="controls:OverflowTextBlock">
+            <Setter Property="HorizontalAlignment" Value="Stretch"/>
+            <Setter Property="ColumnWidth" Value="14"/>
+            <Setter Property="ColumnHeight" Value="14"/>
+            <Setter Property="ScrollButtonFontSize" Value="12"/>
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="controls:OverflowTextBlock">
+                        <Grid x:Name="TokenContainer" Background="{TemplateBinding Background}">
+                            <Grid.Resources>
+                                <ResourceDictionary>
+                                    <ResourceDictionary.ThemeDictionaries>
+                                        <ResourceDictionary x:Key="Light">
+                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundPressed" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundDisabled" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonForeground" Color="#99000000"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver" Color="{ThemeResource SystemAccentColor}" Opacity="0.8"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPressed" Color="{ThemeResource SystemAccentColor}" Opacity="1.0"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundDisabled" Color="#33000000"/>
+                                        </ResourceDictionary>
+                                        <ResourceDictionary x:Key="HighContrast">
+                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundPressed" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundDisabled" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonForeground" Color="{ThemeResource SystemColorWindowTextColor}" Opacity="0.6"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver" Color="{ThemeResource SystemColorHighlightColor}" Opacity="0.8"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPressed" Color="{ThemeResource SystemColorHighlightColor}" Opacity="1.0"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundDisabled" Color="{ThemeResource SystemColorGrayTextColor}" Opacity="0.2"/>
+                                        </ResourceDictionary>
+                                        <ResourceDictionary x:Key="Dark">
+                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundPressed" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonBackgroundDisabled" Color="Transparent"/>
+                                            <SolidColorBrush x:Key="ButtonForeground" Color="#99FFFFFF"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver" Color="{ThemeResource SystemAccentColorLight1}" Opacity="0.8"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundPressed" Color="{ThemeResource SystemAccentColorLight1}" Opacity="1.0"/>
+                                            <SolidColorBrush x:Key="ButtonForegroundDisabled" Color="#33FFFFFF"/>
+                                        </ResourceDictionary>
+                                    </ResourceDictionary.ThemeDictionaries>
+                                </ResourceDictionary>
+                            </Grid.Resources>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto"/>
+                                <ColumnDefinition/>
+                                <ColumnDefinition Width="Auto"/>
+                            </Grid.ColumnDefinitions>
+                            <ScrollViewer x:Name="ExpressionContainer"
+                                          Grid.Column="0"
+                                          Grid.ColumnSpan="3"
+                                          Padding="0,0,0,0"
+                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                          Style="{StaticResource ResultsScrollerSnapped}"
+                                          AutomationProperties.AccessibilityView="Control">
+                                <TextBlock x:Name="EditableToken"
+                                           AutomationProperties.AccessibilityView="Raw"
+                                           Text="{Binding DisplayValue, Mode=OneWay}"
+                                           Margin="4,0,4,0"
+                                           Padding="0"
+                                           VerticalAlignment="Stretch"
+                                           FontWeight="SemiBold"
+                                           Grid.Row="2"
+                                           HorizontalAlignment="Right"/>
+                            </ScrollViewer>
+                            <Border Background="{ThemeResource AppChromeAcrylicHostBackdropMediumLowBrush}"
+                                    Grid.Column="0">
+                                <Button x:Name="ScrollLeft"
+                                    x:Uid="scrollLeft"
+                                    Margin="0,3,0,0"
+                                    Style="{StaticResource AlwaysOnTopScrollButtonStyleS}"
+                                    MinWidth="{TemplateBinding ColumnWidth}"
+                                    MinHeight="{TemplateBinding ColumnHeight}"
+                                    Background="Transparent">
+                                    <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}"
+                                          FontSize="{TemplateBinding ScrollButtonFontSize}"
+                                          Glyph="&#xE26C;"/>
+                                </Button>
+                            </Border>
+                            <Border Background="{ThemeResource AppChromeAcrylicHostBackdropMediumLowBrush}"
+                                    Grid.Column="2">
+                                <Button x:Name="ScrollRight"
+                                    x:Uid="scrollRight"
+                                    Margin="0,3,0,0"
+                                    Style="{StaticResource AlwaysOnTopScrollButtonStyleS}"
+                                    MinWidth="{TemplateBinding ColumnWidth}"
+                                    MinHeight="{TemplateBinding ColumnHeight}"
+                                    Background="Transparent">
+                                    <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}"
+                                          FontSize="{TemplateBinding ScrollButtonFontSize}"
+                                          Glyph="&#xE26B;"/>
+                                </Button>
+                            </Border>
+                        </Grid>
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style>
+
+        <Style x:Key="AlwaysOnTopStyleM" BasedOn="{StaticResource AlwaysOnTopStyleS}" TargetType="controls:OverflowTextBlock">
+            <Setter Property="ColumnWidth" Value="28"/>
+            <Setter Property="ColumnHeight" Value="280"/>
+            <Setter Property="ScrollButtonFontSize" Value="28"/>
+        </Style>
+
         <!-- Calculation Result Styles -->
         <Style x:Key="ResultsStyle"
                BasedOn="{StaticResource CalculationResultStyle}"
@@ -119,6 +244,13 @@
             <Setter Property="Visibility" Value="Collapsed"/>
         </Style>
         
+        <Style x:Key="AlwaysOnTopScrollButtonStyleS" TargetType="Button">
+            <Setter Property="BorderThickness" Value="0"/>
+            <Setter Property="Padding" Value="0,0,0,0"/>
+            <Setter Property="VerticalAlignment" Value="Center"/>
+            <Setter Property="Visibility" Value="Collapsed"/>
+        </Style>
+
         <!-- Flyout Styles -->
 
         <Style x:Key="MemoryFlyoutStyle" TargetType="FlyoutPresenter">
@@ -236,7 +368,6 @@
         <!-- Value Converters -->
 
         <converters:BooleanToVisibilityNegationConverter x:Key="BooleanToVisibilityNegationConverter"/>
-
         <converters:BooleanNegationConverter x:Key="BooleanNegationConverter"/>
 
         <!-- DataTemplate Selectors and Style Selectors -->
@@ -246,6 +377,11 @@
                                                    OperatorTemplate="{StaticResource Operator}"
                                                    SeparatorTemplate="{StaticResource Separator}"/>
 
+        <converters:ExpressionItemTemplateSelector x:Key="AlwaysOnTopExpressionItemTemplateSelector"
+                                                   OperandTemplate="{StaticResource AlwaysOnTopOperand}"
+                                                   OperatorTemplate="{StaticResource AlwaysOnTopOperator}"
+                                                   SeparatorTemplate="{StaticResource AlwaysOnTopSeparator}"/>
+
         <!-- Miscellaneous Resources -->
 
         <automation:NarratorNotifier x:Name="NarratorNotifier" Announcement="{x:Bind Model.Announcement, Mode=OneWay}"/>
@@ -288,6 +424,28 @@
                     <Storyboard Completed="OnErrorLayoutCompleted"/>
                 </VisualState>
             </VisualStateGroup>
+            <!-- Always-on-Top specific -->
+            <VisualStateGroup x:Name="AlwaysOnTopStates">
+                <VisualState x:Name="AlwaysOnTop">
+                    <VisualState.Setters>
+                        <Setter Target="ClearMemoryButton.IsEnabled" Value="False"/>
+                        <Setter Target="MemRecall.IsEnabled" Value="False"/>
+                        <Setter Target="MemPlus.IsEnabled" Value="False"/>
+                        <Setter Target="MemMinus.IsEnabled" Value="False"/>
+                        <Setter Target="MemButton.IsEnabled" Value="False"/>
+                        <Setter Target="RowExpression.Height" Value="0*"/>
+                        <Setter Target="RowHamburger.Height" Value="0"/>
+                        <Setter Target="RowMemoryControls.Height" Value="0*"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="Normal">
+                    <VisualState.Setters>
+                        <Setter Target="RowExpression.Height" Value="20*"/>
+                        <Setter Target="RowHamburger.Height" Value="{StaticResource HamburgerHeightGridLength}"/>
+                        <Setter Target="RowMemoryControls.Height" Value="32*"/>
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
             <!-- Mode specific -->
             <VisualStateGroup x:Name="Mode">
                 <VisualState x:Name="Standard">
@@ -364,7 +522,7 @@
                         <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
                     <VisualState.Setters>
-                        <Setter Target="RowMemoryControls.MinHeight" Value="24"/>
+                        <Setter Target="RowMemoryControls.MinHeight" Value="0"/>
 
                         <Setter Target="ClearMemoryButton.Style" Value="{StaticResource CaptionButtonStyle}"/>
                         <Setter Target="MemRecall.Style" Value="{StaticResource CaptionButtonStyle}"/>
@@ -377,6 +535,30 @@
                 </VisualState>
             </VisualStateGroup>
             <!-- Results display specific -->
+            <VisualStateGroup>
+                <VisualState x:Name="RegularAlwaysOnTop">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="260"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="RowResult.MinHeight" Value="54"/>
+                        <Setter Target="RowResult.Height" Value="72*"/>
+                        <Setter Target="AlwaysOnTopResults.FontSize" Value="40"/>
+                        <Setter Target="AlwaysOnTopResults.Style" Value="{ThemeResource AlwaysOnTopStyleM}"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="MinAlwaysOnTop">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="0"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="RowResult.MinHeight" Value="20"/>
+                        <Setter Target="RowResult.Height" Value="72*"/>
+                        <Setter Target="AlwaysOnTopResults.FontSize" Value="18"/>
+                        <Setter Target="AlwaysOnTopResults.Style" Value="{ThemeResource AlwaysOnTopStyleS}"/>
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
             <VisualStateGroup>
                 <VisualState x:Name="ResultsL">
                     <VisualState.StateTriggers>
@@ -419,19 +601,29 @@
                 <RowDefinition x:Name="RowHamburger" Height="{StaticResource HamburgerHeightGridLength}"/>
                 <RowDefinition x:Name="RowExpression"
                                Height="20*"
-                               MinHeight="20"/>
+                               MinHeight="0"/>
                 <RowDefinition x:Name="RowResult"
                                Height="72*"
-                               MinHeight="72"/>
+                               MinHeight="20"/>
                 <RowDefinition x:Name="RowDisplayControls" Height="0"/>
                 <RowDefinition x:Name="RowMemoryControls"
                                Height="32*"
-                               MinHeight="32"/>
+                               MinHeight="0"/>
                 <RowDefinition x:Name="RowNumPad"
                                Height="308*"
                                MinHeight="0"/>
             </Grid.RowDefinitions>
 
+            <controls:OverflowTextBlock x:Name="ExpressionText"
+                                        Grid.Row="1"
+                                        Margin="6,0,6,0"
+                                        Style="{ThemeResource NormalStyle}"
+                                        VerticalAlignment="Bottom"
+                                        AutomationProperties.AutomationId="CalculatorExpression"
+                                        AutomationProperties.Name="{x:Bind Model.CalculationExpressionAutomationName, Mode=OneWay}"
+                                        IsTabStop="False"
+                                        TokensUpdated="{x:Bind Model.AreTokensUpdated, Mode=OneWay}"
+                                        Visibility="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
             <controls:CalculationResult x:Name="Results"
                                         x:Uid="CalculatorResults"
                                         Grid.Row="2"
@@ -447,15 +639,20 @@
                                         ExpressionVisibility="Visible"
                                         IsInError="{x:Bind Model.IsInError, Mode=OneWay}"
                                         IsOperatorCommand="{x:Bind Model.IsOperatorCommand, Mode=OneWay}"
-                                        TabIndex="1"/>
+                                        TabIndex="1"
-            <controls:OverflowTextBlock x:Name="ExpressionText"
+                                        Visibility="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
-                                        Grid.Row="1"
+            <controls:OverflowTextBlock x:Name="AlwaysOnTopResults"
+                                        x:Uid="CalculatorAlwaysOnTopResults"
+                                        Grid.Row="2"
                                         Margin="6,0,6,0"
-                                        VerticalAlignment="Bottom"
+                                        AutomationProperties.AutomationId="CalculatorAlwaysOnTopResults"
-                                        AutomationProperties.AutomationId="CalculatorExpression"
+                                        AutomationProperties.HeadingLevel="Level1"
-                                        AutomationProperties.Name="{x:Bind Model.CalculationExpressionAutomationName, Mode=OneWay}"
+                                        AutomationProperties.Name="{x:Bind Model.CalculationResultAutomationName, Mode=OneWay}"
-                                        IsTabStop="False"
+                                        TokensUpdated="{x:Bind Model.AreAlwaysOnTopResultsUpdated, Mode=OneWay}"
-                                        TokensUpdated="{x:Bind Model.AreTokensUpdated, Mode=OneWay}"/>
+                                        HorizontalContentAlignment="Right"
+                                        IsActive="True"
+                                        UseSystemFocusVisuals="True"
+                                        Visibility="{x:Bind Model.IsAlwaysOnTop, Mode=OneWay}"/>
 
             <!-- Programmer display panel controls -->
             <local:CalculatorProgrammerOperators x:Name="ProgrammerOperators"
@@ -472,24 +669,28 @@
                                                     TabIndex="7"
                                                     Visibility="{x:Bind Model.IsProgrammer, Mode=OneWay}"/>
 
-            <Button x:Name="HistoryButton"
+            <Grid x:Name="HistoryButtonParent"
+                  Visibility="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}">
+                <Button x:Name="HistoryButton"
                     x:Uid="HistoryButton"
                     Grid.Row="0"
+                    IsEnabled="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanNegationConverter}, Mode=OneWay}"
                     Style="{StaticResource HistoryButtonStyle}"
                     AutomationProperties.AutomationId="HistoryButton"
                     Command="{x:Bind HistoryButtonPressed, Mode=OneTime}"
                     Content="&#xe81c;"
                     ExitDisplayModeOnAccessKeyInvoked="False"
                     TabIndex="2">
-                <FlyoutBase.AttachedFlyout>
+                    <FlyoutBase.AttachedFlyout>
-                    <Flyout x:Name="HistoryFlyout"
+                        <Flyout x:Name="HistoryFlyout"
-                            AutomationProperties.AutomationId="HistoryFlyout"
+                                AutomationProperties.AutomationId="HistoryFlyout"
-                            Closed="HistoryFlyout_Closed"
+                                Closed="HistoryFlyout_Closed"
-                            FlyoutPresenterStyle="{ThemeResource HistoryFlyoutStyle}"
+                                FlyoutPresenterStyle="{ThemeResource HistoryFlyoutStyle}"
-                            Opened="HistoryFlyout_Opened"
+                                Opened="HistoryFlyout_Opened"
-                            Placement="Full"/>
+                                Placement="Full"/>
-                </FlyoutBase.AttachedFlyout>
+                    </FlyoutBase.AttachedFlyout>
-            </Button>
+                </Button>
+            </Grid>
             
             <!-- Scientific angle buttons -->
             <local:CalculatorScientificAngleButtons x:Name="ScientificAngleButtons"
@@ -504,6 +705,7 @@
                   x:Uid="MemoryPanel"
                   Grid.Row="4"
                   Margin="3,0,3,0"
+                  Visibility="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"
                   AutomationProperties.HeadingLevel="Level1">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="1*" MaxWidth="80"/>

src/Calculator/Views/Calculator.xaml.cpp

@@ -40,6 +40,7 @@ using namespace Windows::UI::ViewManagement;
 DEPENDENCY_PROPERTY_INITIALIZATION(Calculator, IsStandard);
 DEPENDENCY_PROPERTY_INITIALIZATION(Calculator, IsScientific);
 DEPENDENCY_PROPERTY_INITIALIZATION(Calculator, IsProgrammer);
+DEPENDENCY_PROPERTY_INITIALIZATION(Calculator, IsAlwaysOnTop);
 
 Calculator::Calculator()
     : m_doAnimate(false)
@@ -60,6 +61,8 @@ Calculator::Calculator()
     auto resLoader = AppResourceProvider::GetInstance();
     CopyMenuItem->Text = resLoader.GetResourceString(L"copyMenuItem");
     PasteMenuItem->Text = resLoader.GetResourceString(L"pasteMenuItem");
+
+    this->SizeChanged += ref new SizeChangedEventHandler(this, &Calculator::Calculator_SizeChanged);
 }
 
 void Calculator::LoadResourceStrings()
@@ -97,7 +100,7 @@ void Calculator::SetFontSizeResources()
         { L"Tibt", 104, 29.333, 20, 40, 56, 40, 56 },   { L"Default", 104, 29.333, 23, 40, 56, 40, 56 }
     };
 
-    DecimalFormatter^ formatter = LocalizationService::GetInstance()->GetRegionalSettingsAwareDecimalFormatter();
+    DecimalFormatter ^ formatter = LocalizationService::GetInstance()->GetRegionalSettingsAwareDecimalFormatter();
 
     const FontTable* currentItem = fontTables;
     while (currentItem->numericSystem.compare(std::wstring(L"Default")) != 0 && currentItem->numericSystem.compare(formatter->NumeralSystem->Data()) != 0)
@@ -279,6 +282,35 @@ void Calculator::OnIsProgrammerPropertyChanged(bool /*oldValue*/, bool newValue)
     UpdatePanelViewState();
 }
 
+void Calculator::OnIsAlwaysOnTopPropertyChanged(bool /*oldValue*/, bool newValue)
+{
+    if (newValue)
+    {
+        VisualStateManager::GoToState(this, L"AlwaysOnTop", false);
+    }
+    else
+    {
+        VisualStateManager::GoToState(this, L"Normal", false);
+        if (Model->IsInError)
+        {
+            VisualStateManager::GoToState(this, L"ErrorLayout", false);
+        }
+        else
+        {
+            EnableMemoryControls(true);
+        }
+    }
+
+    Model->IsMemoryEmpty = (Model->MemorizedNumbers->Size == 0) || IsAlwaysOnTop;
+
+    AlwaysOnTopResults->UpdateScrollButtons();
+    Results->UpdateTextState();
+
+    UpdateViewState();
+    UpdatePanelViewState();
+    SetDefaultFocus();
+}
+
 void Calculator::OnIsInErrorPropertyChanged()
 {
     bool isError = Model->IsInError;
@@ -395,33 +427,36 @@ void Calculator::UpdateHistoryState()
 
 void Calculator::UpdateMemoryState()
 {
-    if (!Model->IsMemoryEmpty)
+    if (!IsAlwaysOnTop)
     {
-        MemRecall->IsEnabled = true;
+        if (!Model->IsMemoryEmpty)
-        ClearMemoryButton->IsEnabled = true;
-    }
-    else
-    {
-        MemRecall->IsEnabled = false;
-        ClearMemoryButton->IsEnabled = false;
-    }
-
-    String ^ viewState = App::GetAppViewState();
-    if (viewState == ViewState::DockedView)
-    {
-        CloseMemoryFlyout();
-        SetChildAsMemory();
-        MemoryButton->Visibility = ::Visibility::Collapsed;
-
-        if (m_IsLastFlyoutMemory && !IsProgrammer)
         {
-            DockPivot->SelectedIndex = 1;
+            MemRecall->IsEnabled = true;
+            ClearMemoryButton->IsEnabled = true;
+        }
+        else
+        {
+            MemRecall->IsEnabled = false;
+            ClearMemoryButton->IsEnabled = false;
+        }
+
+        String ^ viewState = App::GetAppViewState();
+        if (viewState == ViewState::DockedView)
+        {
+            CloseMemoryFlyout();
+            SetChildAsMemory();
+            MemoryButton->Visibility = ::Visibility::Collapsed;
+
+            if (m_IsLastFlyoutMemory && !IsProgrammer)
+            {
+                DockPivot->SelectedIndex = 1;
+            }
+        }
+        else
+        {
+            MemoryButton->Visibility = ::Visibility::Visible;
+            DockMemoryHolder->Child = nullptr;
         }
-    }
-    else
-    {
-        MemoryButton->Visibility = ::Visibility::Visible;
-        DockMemoryHolder->Child = nullptr;
     }
 }
 
@@ -507,7 +542,14 @@ void Calculator::CloseMemoryFlyout()
 
 void Calculator::SetDefaultFocus()
 {
-    Results->Focus(::FocusState::Programmatic);
+    if (!IsAlwaysOnTop)
+    {
+        Results->Focus(::FocusState::Programmatic);
+    }
+    else
+    {
+        AlwaysOnTopResults->Focus(::FocusState::Programmatic);
+    }
 }
 
 void Calculator::ToggleHistoryFlyout(Object ^ /*parameter*/)
@@ -696,5 +738,13 @@ void CalculatorApp::Calculator::OnVisualStateChanged(Platform::Object ^ sender,
 {
     auto mode = IsStandard ? ViewMode::Standard : IsScientific ? ViewMode::Scientific : ViewMode::Programmer;
     auto state = std::wstring(e->NewState->Name->Begin());
-    TraceLogger::GetInstance().LogVisualStateChanged(mode, state);
+    TraceLogger::GetInstance().LogVisualStateChanged(mode, state, IsAlwaysOnTop);
+}
+
+void Calculator::Calculator_SizeChanged(Object ^ /*sender*/, SizeChangedEventArgs ^ /*e*/)
+{
+    if (Model->IsAlwaysOnTop)
+    {
+        AlwaysOnTopResults->UpdateScrollButtons();
+    }
 }

src/Calculator/Views/Calculator.xaml.h

@@ -53,6 +53,7 @@ public
         DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(bool, IsStandard, false);
         DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(bool, IsScientific, false);
         DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(bool, IsProgrammer, false);
+        DEPENDENCY_PROPERTY_WITH_DEFAULT_AND_CALLBACK(bool, IsAlwaysOnTop, false);
 
         COMMAND_FOR_METHOD(HistoryButtonPressed, Calculator::ToggleHistoryFlyout);
 
@@ -75,12 +76,12 @@ public
         void UpdateMemoryState();
         void UpdateHistoryState();
 
-        void CalculationResultsOnSelected(_In_ Platform::Object ^ sender);
         void OnContextRequested(Windows::UI::Xaml::UIElement ^ sender, Windows::UI::Xaml::Input::ContextRequestedEventArgs ^ e);
         void OnContextCanceled(Windows::UI::Xaml::UIElement ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
         void OnIsScientificPropertyChanged(bool oldValue, bool newValue);
         void OnIsProgrammerPropertyChanged(bool oldValue, bool newValue);
         void OnIsStandardPropertyChanged(bool oldValue, bool newValue);
+        void OnIsAlwaysOnTopPropertyChanged(bool oldValue, bool newValue);
         void OnIsInErrorPropertyChanged();
         void OnCalcPropertyChanged(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::Data::PropertyChangedEventArgs ^ e);
         void OnStoryboardCompleted(_In_ Platform::Object ^ sender, _In_ Platform::Object ^ e);
@@ -89,6 +90,7 @@ public
         void EnsureProgrammer();
         void SetFontSizeResources();
         std::wstring GetCurrentLayoutState();
+        void Calculator_SizeChanged(Object ^ sender, Windows::UI::Xaml::SizeChangedEventArgs ^ e);
 
     private:
         Windows::UI::Xaml::Controls::ListView ^ m_tokenList;

src/Calculator/Views/CalculatorProgrammerRadixOperators.xaml

@@ -216,7 +216,7 @@
                       FontSize="16"
                       AutomationProperties.AutomationId="shiftButton"
                       Checked="Shift_Clicked"
-                      Content=""
+                      Content=""
                       Unchecked="Shift_Clicked"/>
         <controls:CalculatorButton x:Name="ModButton"
                                    x:Uid="modButton"
@@ -430,6 +430,6 @@
                                    FontSize="12"
                                    AutomationProperties.AutomationId="negateButton"
                                    ButtonId="Negate"
-                                   Content="&#xE94D;"/>
+                                   Content="&#xF898;"/>
     </Grid>
 </UserControl>

src/Calculator/Views/CalculatorScientificOperators.xaml

@@ -511,7 +511,7 @@
                                            Style="{StaticResource SymbolOperatorButtonStyle}"
                                            AutomationProperties.AutomationId="squareRootButton"
                                            ButtonId="Sqrt"
-                                           Content=""/>
+                                           Content=""/>
                 <controls:CalculatorButton x:Name="PowerOf10Button"
                                            x:Uid="powerOf10Button"
                                            Grid.Column="1"
@@ -600,7 +600,7 @@
                       FontSize="20"
                       AutomationProperties.AutomationId="shiftButton"
                       Checked="shiftButton_Check"
-                      Content="&#xE752;"
+                      Content="&#xF897;"
                       IsEnabled="{x:Bind IsShiftEnabled(IsWideLayout, IsErrorVisualState), Mode=OneWay}"
                       IsEnabledChanged="shiftButton_IsEnabledChanged"
                       Unchecked="shiftButton_Check"/>
@@ -718,7 +718,7 @@
                                    FontSize="16"
                                    AutomationProperties.AutomationId="negateButton"
                                    ButtonId="Negate"
-                                   Content="&#xE94D;"
+                                   Content="&#xF898;"
                                    IsEnabled="{x:Bind Model.IsNegateEnabled, Mode=OneWay}"/>
         <controls:CalculatorButton x:Name="OpenParenthesisButton"
                                    x:Uid="openParenthesisButton"

src/Calculator/Views/CalculatorStandardOperators.xaml

@@ -46,6 +46,60 @@
                     </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
+            <VisualStateGroup>
+                <VisualState x:Name="NormalFontSize">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="440" MinWindowWidth="0"/>
+                    </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="SmallFontSize">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="260" MinWindowWidth="0"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle18}"/>
+                    </VisualState.Setters>
+                </VisualState>
+                <VisualState x:Name="TinyFontSize">
+                    <VisualState.StateTriggers>
+                        <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
+                    </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="PercentButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="SquareRootButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="XPower2Button.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="InvertButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="NegateButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="ClearEntryButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="ClearButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="BackSpaceButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="DivideButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="MultiplyButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="MinusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="PlusButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+                        <Setter Target="EqualButton.FontSize" Value="{StaticResource CalcStandardOperatorCaptionSizeTiny}"/>
+
+                        <Setter Target="NumberPad.ButtonStyle" Value="{StaticResource NumericButtonStyle12}"/>
+                    </VisualState.Setters>
+                </VisualState>
+            </VisualStateGroup>
             <VisualStateGroup>
                 <VisualState x:Name="Portrait768x1366">
                     <VisualState.StateTriggers>
@@ -238,11 +292,41 @@
                     <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="StandardFunctions.Visibility" Value="Visible"/>
+                    </VisualState.Setters>
                 </VisualState>
                 <VisualState x:Name="DefaultLayout">
                     <VisualState.StateTriggers>
                         <AdaptiveTrigger MinWindowHeight="0" MinWindowWidth="0"/>
                     </VisualState.StateTriggers>
+                    <VisualState.Setters>
+                        <Setter Target="R0.Height" Value="0*"/>
+                        <Setter Target="StandardFunctions.Visibility" Value="Collapsed"/>
+                    </VisualState.Setters>
                 </VisualState>
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
@@ -279,7 +363,7 @@
                                        Style="{StaticResource SymbolOperatorButtonStyle}"
                                        AutomationProperties.AutomationId="squareRootButton"
                                        ButtonId="Sqrt"
-                                       Content="&#xE94B;"/>
+                                       Content="&#xF899;"/>
             <controls:CalculatorButton x:Name="XPower2Button"
                                        x:Uid="xpower2Button"
                                        Grid.Column="2"
@@ -410,6 +494,6 @@
                                    Style="{StaticResource SymbolOperatorButtonStyle}"
                                    AutomationProperties.AutomationId="negateButton"
                                    ButtonId="Negate"
-                                   Content="&#xE94D;"/>
+                                   Content="&#xF898;"/>
     </Grid>
 </UserControl>

src/Calculator/Views/CalculatorStandardOperators.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.
 
 //

src/Calculator/Views/CalculatorStandardOperators.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.
 
 //

src/Calculator/Views/MainPage.xaml

@@ -32,6 +32,9 @@
         <Style x:Key="NavViewItemStyle" TargetType="muxc:NavigationViewItem">
             <Setter Property="KeyTipPlacementMode" Value="Right"/>
         </Style>
+
+        <converters:BooleanToVisibilityNegationConverter x:Key="BooleanToVisibilityNegationConverter"/>
+        <converters:BooleanNegationConverter x:Key="BooleanNegationConverter"/>
     </Page.Resources>
 
     <Grid>
@@ -83,7 +86,20 @@
                     Command="{x:Bind Model.PasteCommand}"/>
         </StackPanel>
 
-        <local:TitleBar x:Name="CustomTitleBar" Grid.Row="0"/>
+        <local:TitleBar x:Name="CustomTitleBar" Grid.Row="0"
+                        ApplicationViewModel="{x:Bind Model}"/>
+        
+        <Grid Grid.Row="1">
+            <Border x:Name="CalcHolder">
+                <!-- PLACEHOLDER!!!! This is where the calculator goes when it is delay loaded -->
+            </Border>
+            <Border x:Name="DateCalcHolder">
+                <!-- PLACEHOLDER!!!! This is where the date calculator goes when it is delay loaded -->
+            </Border>
+            <Border x:Name="ConverterHolder">
+                <!-- PLACEHOLDER!!!! This is where the converter goes when it is delay loaded -->
+            </Border>
+        </Grid>
         
         <muxc:NavigationView x:Name="NavView"
                              x:Uid="NavView"
@@ -92,6 +108,8 @@
                              DataContext="{x:Bind Model}"
                              ExpandedModeThresholdWidth="Infinity"
                              IsBackButtonVisible="Collapsed"
+                             IsPaneToggleButtonVisible="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanNegationConverter}, Mode=OneWay}"
+                             IsEnabled="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanNegationConverter}, Mode=OneWay}"
                              IsSettingsVisible="False"
                              Loaded="OnNavLoaded"
                              MenuItemsSource="{x:Bind CreateUIElementsForCategories(Model.Categories), Mode=OneWay}"
@@ -103,6 +121,7 @@
                              ItemInvoked="OnNavItemInvoked"
                              TabIndex="1"
                              UseSystemFocusVisuals="True">
+
             <muxc:NavigationView.PaneFooter>
                 <StackPanel HorizontalAlignment="Stretch" Orientation="Vertical">
                     <muxc:NavigationViewList x:Name="NavFooter"
@@ -135,24 +154,31 @@
                     </muxc:NavigationViewList>
                 </StackPanel>
             </muxc:NavigationView.PaneFooter>
-
             <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="Auto"></ColumnDefinition>
+                    <ColumnDefinition Width="Auto"></ColumnDefinition>
+                </Grid.ColumnDefinitions>
                 <TextBlock x:Name="Header"
                            Margin="52,6,12,0"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top"
+                           Visibility="{x:Bind Model.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"
                            Style="{StaticResource SubtitleTextBlockStyle}"
-                           Text="{x:Bind Model.CategoryName, Mode=OneWay}"/>
+                           Text="{x:Bind Model.CategoryName, Mode=OneWay}"
-
+                           Grid.Column="0"/>
-                <Border x:Name="CalcHolder">
+                <Button x:Name="NormalAlwaysOnTopButton"
-                    <!-- PLACEHOLDER!!!! This is where the calculator goes when it is delay loaded -->
+                        x:Uid="EnterAlwaysOnTopButton"
-                </Border>
+                        FontFamily="{StaticResource CalculatorFontFamily}"
-                <Border x:Name="DateCalcHolder">
+                        Style="{StaticResource SquareIconButtonStyle}"
-                    <!-- PLACEHOLDER!!!! This is where the date calculator goes when it is delay loaded -->
+                        Content="&#xEE49;"
-                </Border>
+                        Click="AlwaysOnTopButtonClick"
-                <Border x:Name="ConverterHolder">
+                        VerticalAlignment="Top"
-                    <!-- PLACEHOLDER!!!! This is where the converter goes when it is delay loaded -->
+                        HorizontalContentAlignment="Center"
-                </Border>
+                        Background="Transparent"
+                        Visibility="{x:Bind Model.DisplayNormalAlwaysOnTopOption, Mode=OneWay}"
+                        AutomationProperties.AutomationId="NormalAlwaysOnTopButton"
+                        Grid.Column="1"/>
             </Grid>
         </muxc:NavigationView>
     </Grid>

src/Calculator/Views/MainPage.xaml.cpp

@@ -70,7 +70,9 @@ MainPage::MainPage()
 
     KeyboardShortcutManager::Initialize();
 
+    Application::Current->Suspending += ref new SuspendingEventHandler(this, &MainPage::App_Suspending);
     m_model->PropertyChanged += ref new PropertyChangedEventHandler(this, &MainPage::OnAppPropertyChanged);
+    m_accessibilitySettings = ref new AccessibilitySettings();
 
     double sizeInInches = 0.0;
 
@@ -243,6 +245,8 @@ void MainPage::OnPageLoaded(_In_ Object ^, _In_ RoutedEventArgs ^ args)
     }
 
     m_windowSizeEventToken = Window::Current->SizeChanged += ref new WindowSizeChangedEventHandler(this, &MainPage::WindowSizeChanged);
+    m_accessibilitySettingsToken = m_accessibilitySettings->HighContrastChanged +=
+        ref new Windows::Foundation::TypedEventHandler<AccessibilitySettings ^, Object ^>(this, &CalculatorApp::MainPage::OnHighContrastChanged);
     UpdateViewState();
 
     SetHeaderAutomationName();
@@ -259,6 +263,15 @@ void MainPage::OnPageLoaded(_In_ Object ^, _In_ RoutedEventArgs ^ args)
         }));
 }
 
+void MainPage::OnHighContrastChanged(_In_ AccessibilitySettings ^ /*sender*/, _In_ Object ^ /*args*/)
+{
+    if (Model->IsAlwaysOnTop && this->ActualHeight < 394)
+    {
+        // Sets to default always-on-top size to force re-layout
+        ApplicationView::GetForCurrentView()->TryResizeView(Size(320, 394));
+    }
+}
+
 void MainPage::SetDefaultFocus()
 {
     if (m_calculator != nullptr && m_calculator->Visibility == ::Visibility::Visible)
@@ -292,13 +305,16 @@ void MainPage::EnsureCalculator()
         Binding ^ isProgramerBinding = ref new Binding();
         isProgramerBinding->Path = ref new PropertyPath(L"IsProgrammer");
         m_calculator->SetBinding(m_calculator->IsProgrammerProperty, isProgramerBinding);
+        Binding ^ isAlwaysOnTopBinding = ref new Binding();
+        isAlwaysOnTopBinding->Path = ref new PropertyPath(L"IsAlwaysOnTop");
+        m_calculator->SetBinding(m_calculator->IsAlwaysOnTopProperty, isAlwaysOnTopBinding);
         m_calculator->Style = CalculatorBaseStyle;
 
         CalcHolder->Child = m_calculator;
 
         // Calculator's "default" state is visible, but if we get delay loaded
         // when in converter, we should not be visible. This is not a problem for converter
-        // since it's default state is hidden.
+        // since its default state is hidden.
         ShowHideControls(this->Model->Mode);
     }
 
@@ -477,6 +493,8 @@ void MainPage::UnregisterEventHandlers()
 {
     Window::Current->SizeChanged -= m_windowSizeEventToken;
     m_windowSizeEventToken.Value = 0;
+    m_accessibilitySettings->HighContrastChanged -= m_accessibilitySettingsToken;
+    m_accessibilitySettingsToken.Value = 0;
 
     if (m_calculator != nullptr)
     {
@@ -527,3 +545,18 @@ void MainPage::OnNavItemInvoked(MUXC::NavigationView ^ /*sender*/, _In_ MUXC::Na
 {
     NavView->IsPaneOpen = false;
 }
+
+void MainPage::AlwaysOnTopButtonClick(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e)
+{
+    Model->ToggleAlwaysOnTop(0, 0);
+}
+
+void MainPage::App_Suspending(Object ^ sender, Windows::ApplicationModel::SuspendingEventArgs ^ e)
+{
+    if (m_model->IsAlwaysOnTop)
+    {
+        ApplicationDataContainer ^ localSettings = ApplicationData::Current->LocalSettings;
+        localSettings->Values->Insert(ApplicationViewModel::WidthLocalSettings, this->ActualWidth);
+        localSettings->Values->Insert(ApplicationViewModel::HeightLocalSettings, this->ActualHeight);
+    }
+}

src/Calculator/Views/MainPage.xaml.h

@@ -56,6 +56,7 @@ public
         void OnAboutButtonClick(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::Controls::ItemClickEventArgs ^ e);
         void OnAboutFlyoutOpened(_In_ Platform::Object ^ sender, _In_ Platform::Object ^ e);
         void OnAboutFlyoutClosed(_In_ Platform::Object ^ sender, _In_ Platform::Object ^ e);
+        void AlwaysOnTopButtonClick(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
 
         Microsoft::UI::Xaml::Controls::NavigationViewItemHeader ^ CreateNavViewHeaderFromGroup(CalculatorApp::Common::NavCategoryGroup ^ group);
         Microsoft::UI::Xaml::Controls::NavigationViewItem ^ CreateNavViewItemFromCategory(CalculatorApp::Common::NavCategory ^ category);
@@ -63,8 +64,10 @@ public
         void ShowHideControls(CalculatorApp::Common::ViewMode mode);
         void UpdateViewState();
         void UpdatePanelViewState();
+        void OnHighContrastChanged(Windows::UI::ViewManagement::AccessibilitySettings ^ sender, Platform::Object ^ args);
 
         void OnPageLoaded(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void App_Suspending(Object ^ sender, Windows::ApplicationModel::SuspendingEventArgs ^ e);
 
         void EnsureCalculator();
         void EnsureConverter();
@@ -78,5 +81,7 @@ public
         CalculatorApp::DateCalculator ^ m_dateCalculator;
         Windows::Foundation::EventRegistrationToken m_windowSizeEventToken;
         CalculatorApp::ViewModel::ApplicationViewModel ^ m_model;
+        Windows::Foundation::EventRegistrationToken m_accessibilitySettingsToken;
+        Windows::UI::ViewManagement::AccessibilitySettings ^ m_accessibilitySettings;
     };
 }

src/Calculator/Views/TitleBar.xaml

@@ -3,21 +3,28 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:converters="using:CalculatorApp.Converters"
              mc:Ignorable="d">
+    <UserControl.Resources>
+        <converters:BooleanToVisibilityNegationConverter x:Key="BooleanToVisibilityNegationConverter"/>
+    </UserControl.Resources>
     <Grid x:Name="LayoutRoot"
           Height="32"
           HorizontalAlignment="Stretch">
-        <VisualStateManager.VisualStateGroups>
+        <Grid x:Name="BackgroundElement"
-            <VisualStateGroup x:Name="WindowFocusStates">
+              Background="Transparent"
-                <VisualState x:Name="WindowFocused"/>
+              Height="32">
-                <VisualState x:Name="WindowNotFocused">
+            <VisualStateManager.VisualStateGroups>
-                    <VisualState.Setters>
+                <VisualStateGroup x:Name="WindowFocusStates">
-                        <Setter Target="AppName.Foreground" Value="{ThemeResource SystemControlForegroundChromeDisabledLowBrush}"/>
+                    <VisualState x:Name="WindowFocused"/>
-                    </VisualState.Setters>
+                    <VisualState x:Name="WindowNotFocused">
-                </VisualState>
+                        <VisualState.Setters>
-            </VisualStateGroup>
+                            <Setter Target="AppName.Foreground" Value="{ThemeResource SystemControlForegroundChromeDisabledLowBrush}"/>
-        </VisualStateManager.VisualStateGroups>
+                        </VisualState.Setters>
-        <TextBlock x:Name="AppName"
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateManager.VisualStateGroups>
+            <TextBlock x:Name="AppName"
                    x:Uid="AppName"
                    Margin="12,0,12,0"
                    HorizontalAlignment="Left"
@@ -25,6 +32,25 @@
                    Foreground="{ThemeResource TitleBarForegroundBaseHighBrush}"
                    FontSize="12"
                    TextAlignment="Left"
-                   TextTrimming="CharacterEllipsis"/>
+                   TextTrimming="CharacterEllipsis"
+                   Visibility="{x:Bind ApplicationViewModel.IsAlwaysOnTop, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
+        </Grid>
+        <Button x:Name="AoTAlwaysOnTopButton"
+                x:Uid="ExitAlwaysOnTopButton"
+                Grid.Row="0"
+                FontFamily="{StaticResource CalculatorFontFamily}"
+                Style="{ThemeResource CommandBarFlyoutEllipsisButtonStyle}"
+                Content="&#xEE47;"
+                Click="AlwaysOnTopButtonClick"
+                Width="46"
+                Height="32"
+                HorizontalAlignment="Left"
+                HorizontalContentAlignment="Center"
+                Background="Transparent"
+                FontWeight="Thin"
+                FontSize="14"
+                AllowFocusWhenDisabled="False"
+                Visibility="{x:Bind ApplicationViewModel.IsAlwaysOnTop, Mode=OneWay}"
+                AutomationProperties.AutomationId="AoTAlwaysOnTopButton"/>
     </Grid>
 </UserControl>

src/Calculator/Views/TitleBar.xaml.cpp

@@ -15,11 +15,15 @@ using namespace Windows::UI;
 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::Media;
 using namespace Windows::Foundation::Collections;
+using namespace Concurrency;
 
 namespace CalculatorApp
 {
+    DEPENDENCY_PROPERTY_INITIALIZATION(TitleBar, ApplicationViewModel);
+
     TitleBar::TitleBar()
         : m_coreTitleBar(CoreApplication::GetCurrentView()->TitleBar)
     {
@@ -27,6 +31,9 @@ namespace CalculatorApp
         m_accessibilitySettings = ref new AccessibilitySettings();
         InitializeComponent();
 
+        m_coreTitleBar->ExtendViewIntoTitleBar = true;
+        Window::Current->SetTitleBar(BackgroundElement);
+
         Loaded += ref new RoutedEventHandler(this, &TitleBar::OnLoaded);
         Unloaded += ref new RoutedEventHandler(this, &TitleBar::OnUnloaded);
 #ifdef IsStoreBuild
@@ -55,7 +62,7 @@ namespace CalculatorApp
         // Set properties
         LayoutRoot->Height = m_coreTitleBar->Height;
         SetTitleBarControlColors();
-        SetTitleBarExtendView();
+
         SetTitleBarVisibility();
         SetTitleBarPadding();
     }
@@ -75,14 +82,10 @@ namespace CalculatorApp
         m_windowActivatedToken.Value = 0;
     }
 
-    void TitleBar::SetTitleBarExtendView()
-    {
-        m_coreTitleBar->ExtendViewIntoTitleBar = !m_accessibilitySettings->HighContrast;
-    }
 
     void TitleBar::SetTitleBarVisibility()
     {
-        this->LayoutRoot->Visibility = m_coreTitleBar->IsVisible && !m_accessibilitySettings->HighContrast ? ::Visibility::Visible : ::Visibility::Collapsed;
+        this->LayoutRoot->Visibility = m_coreTitleBar->IsVisible || ApplicationViewModel->IsAlwaysOnTop ? ::Visibility::Visible : ::Visibility::Collapsed;
     }
 
     void TitleBar::SetTitleBarPadding()
@@ -160,7 +163,6 @@ namespace CalculatorApp
     {
         Dispatcher->RunAsync(CoreDispatcherPriority::Normal, ref new DispatchedHandler([this]() {
                                  SetTitleBarControlColors();
-                                 SetTitleBarExtendView();
                                  SetTitleBarVisibility();
                              }));
     }
@@ -170,4 +172,10 @@ namespace CalculatorApp
         VisualStateManager::GoToState(
             this, e->WindowActivationState == CoreWindowActivationState::Deactivated ? WindowNotFocused->Name : WindowFocused->Name, false);
     }
+
+    void TitleBar::AlwaysOnTopButtonClick(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e)
+    {
+        auto bounds = Window::Current->Bounds;
+        ApplicationViewModel->ToggleAlwaysOnTop(bounds.Width, bounds.Height);
+    }
 }

src/Calculator/Views/TitleBar.xaml.h

@@ -4,6 +4,7 @@
 #pragma once
 
 #include "Views/TitleBar.g.h"
+#include "CalcViewModel\ApplicationViewModel.h"
 
 namespace CalculatorApp
 {
@@ -18,6 +19,9 @@ public
     public:
         TitleBar();
 
+        DEPENDENCY_PROPERTY_OWNER(TitleBar);
+        DEPENDENCY_PROPERTY(ViewModel::ApplicationViewModel ^, ApplicationViewModel);
+
     private:
         void OnLoaded(_In_ Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
         void OnUnloaded(_In_ Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
@@ -26,7 +30,6 @@ public
         void SetTitleBarVisibility();
         void SetTitleBarPadding();
         void SetTitleBarControlColors();
-        void SetTitleBarExtendView();
         void ColorValuesChanged(_In_ Windows::UI::ViewManagement::UISettings ^ sender, _In_ Platform::Object ^ e);
         void OnHighContrastChanged(Windows::UI::ViewManagement::AccessibilitySettings ^ sender, Platform::Object ^ args);
         void OnWindowActivated(Platform::Object ^ sender, Windows::UI::Core::WindowActivatedEventArgs ^ e);
@@ -39,5 +42,6 @@ public
         Windows::Foundation::EventRegistrationToken m_accessibilitySettingsToken;
         Windows::UI::ViewManagement::UISettings ^ m_uiSettings;
         Windows::UI::ViewManagement::AccessibilitySettings ^ m_accessibilitySettings;
+        void AlwaysOnTopButtonClick(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
     };
 }

src/Calculator/Views/UnitConverter.xaml

@@ -706,7 +706,7 @@
                                        Style="{StaticResource SymbolOperatorButtonStyle}"
                                        FontSize="16"
                                        ButtonId="Negate"
-                                       Content=""
+                                       Content=""
                                        TabIndex="6"
                                        Visibility="{x:Bind Model.CurrentCategory.NegateVisibility, Mode=OneWay}"/>
         </Grid>