Improve narrator screen reader messages of Settings page

src/CalcViewModel/Common/Automation/NarratorAnnouncement.cpp

@@ -30,6 +30,7 @@ namespace CalculatorApp::ViewModel::Common::Automation
         StringReference GraphViewBestFitChanged(L"GraphViewBestFitChanged");
         StringReference AlwaysOnTop(L"AlwaysOnTop");
         StringReference BitShiftRadioButtonContent(L"BitShiftRadioButtonContent");
+        StringReference SettingsPageOpened(L"SettingsPageOpened");
     }
 }
 
@@ -204,3 +205,12 @@ NarratorAnnouncement ^ CalculatorAnnouncement::GetBitShiftRadioButtonCheckedAnno
         AutomationNotificationKind::ActionCompleted,
         AutomationNotificationProcessing::ImportantMostRecent);
 }
+
+NarratorAnnouncement ^ CalculatorAnnouncement::GetSettingsPageOpenedAnnouncement(Platform::String ^ announcement)
+{
+    return ref new NarratorAnnouncement(
+        announcement,
+        CalculatorActivityIds::SettingsPageOpened,
+        AutomationNotificationKind::ActionCompleted,
+        AutomationNotificationProcessing::ImportantMostRecent);
+}

src/CalcViewModel/Common/Automation/NarratorAnnouncement.h

@@ -75,5 +75,7 @@ public
         static NarratorAnnouncement ^ GetAlwaysOnTopChangedAnnouncement(Platform::String ^ announcement);
 
         static NarratorAnnouncement ^ GetBitShiftRadioButtonCheckedAnnouncement(Platform::String ^ announcement);
+
+        static NarratorAnnouncement ^ GetSettingsPageOpenedAnnouncement(Platform::String ^ announcement);
     };
 }

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

@@ -4723,4 +4723,24 @@
     <value>Use system setting</value>
     <comment>Lable for the app theme option to use system setting</comment>
   </data>
+  <data name="TitleBarBackButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Back</value>
+    <comment>Screen reader prompt for the Back button in title bar to back to main page</comment>
+  </data>
+  <data name="SettingsPageOpenedAnnouncement" xml:space="preserve">
+    <value>Settings Page</value>
+    <comment>Announcement used when Settings page is opened</comment>
+  </data>
+  <data name="AppThemeExpander.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>App theme Setting</value>
+    <comment>Screen reader prompt for the App theme Setting radio buttons group</comment>
+  </data>
+  <data name="LightThemeRadioButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Light mode</value>
+    <comment>Screen reader prompt for the App theme Light mode radio button</comment>
+  </data>
+  <data name="DarkThemeRadioButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Dark mode</value>
+    <comment>Screen reader prompt for the App theme Dark mode radio button</comment>
+  </data>
 </root>

src/Calculator/Views/MainPage.xaml

@@ -157,6 +157,7 @@
         </muxc:NavigationView>
 
         <Popup x:Name="Popup"
+               AutomationProperties.AccessibilityView="Raw"
                Closed="Popup_Closed"
                HorizontalOffset="0"
                IsLightDismissEnabled="False"

src/Calculator/Views/Settings.xaml

@@ -1,6 +1,7 @@
 <UserControl x:Class="CalculatorApp.Settings"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:automation="using:CalculatorApp.ViewModel.Common.Automation"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:local="using:CalculatorApp"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
@@ -9,7 +10,6 @@
              Unloaded="OnUnloaded"
              mc:Ignorable="d">
 
-
     <UserControl.Resources>
         <ResourceDictionary>
             <Style x:Key="SettingsContentScrollViewStyle" TargetType="ScrollViewer">
@@ -30,6 +30,8 @@
                 <Setter Property="FontSize" Value="{ThemeResource BodyFontSize}"/>
                 <Setter Property="TextWrapping" Value="Wrap"/>
             </Style>
+
+            <automation:NarratorNotifier x:Name="NarratorNotifier"/>
         </ResourceDictionary>
     </UserControl.Resources>
 
@@ -95,9 +97,12 @@
                     <RowDefinition x:Name="AboutTitleContentRow" Height="*"/>
                 </Grid.RowDefinitions>
 
-                <TextBlock x:Uid="SettingsAppearance" Style="{StaticResource BodyStrongTextBlockStyle}"/>
+                <TextBlock x:Uid="SettingsAppearance"
+                           Style="{StaticResource BodyStrongTextBlockStyle}"
+                           AutomationProperties.HeadingLevel="Level1"/>
 
                 <muxc:Expander x:Name="AppThemeExpander"
+                               x:Uid="AppThemeExpander"
                                Grid.Row="1"
                                Margin="0,8,0,0"
                                HorizontalAlignment="Stretch"
@@ -157,7 +162,8 @@
                     <TextBlock x:Name="AboutGroupTitle"
                                x:Uid="AboutGroupTitle"
                                Margin="0,20,0,0"
-                               Style="{ThemeResource BodyStrongTextBlockStyle}"/>
+                               Style="{ThemeResource BodyStrongTextBlockStyle}"
+                               AutomationProperties.HeadingLevel="Level1"/>
                     <StackPanel Grid.Row="1"
                                 Margin="0,8,0,0"
                                 Orientation="Vertical">

src/Calculator/Views/Settings.xaml.cs

@@ -17,6 +17,7 @@ using Windows.UI.Xaml.Data;
 using Windows.UI.Xaml.Input;
 using Windows.UI.Xaml.Media;
 using Windows.UI.Xaml.Navigation;
+using CalculatorApp.ViewModel.Common.Automation;
 
 // The User Control item template is documented at https://go.microsoft.com/fwlink/?LinkId=234236
 
@@ -62,12 +63,21 @@ namespace CalculatorApp
         // OnLoaded would be invoked by Popup several times while contructed once
         private void OnLoaded(object sender, RoutedEventArgs args)
         {
+            AnnouncePageOpened();
+
             var currentTheme = ThemeHelper.RootTheme.ToString();
             (ThemeRadioButtons.Items.Cast<RadioButton>().FirstOrDefault(c => c?.Tag?.ToString() == currentTheme)).IsChecked = true;
 
             SetDefaultFocus();
         }
 
+        private void AnnouncePageOpened()
+        {
+            string announcementText = AppResourceProvider.GetInstance().GetResourceString("SettingsPageOpenedAnnouncement");
+            NarratorAnnouncement announcement = CalculatorAnnouncement.GetSettingsPageOpenedAnnouncement(announcementText);
+            NarratorNotifier.Announce(announcement);
+        }
+
         // OnUnloaded would be invoked by Popup several times while contructed once
         private void OnUnloaded(object sender, RoutedEventArgs e)
         {

src/Calculator/Views/TitleBar.xaml

@@ -47,6 +47,7 @@
             </Grid.Transitions>
 
             <Button x:Name="BackButton"
+                    x:Uid="TitleBarBackButton"
                     Width="44"
                     Height="32"
                     Margin="0,0,4,0"
@@ -72,6 +73,7 @@
                            Height="16"
                            Margin="16,0,0,0"
                            VerticalAlignment="Center"
+                           AutomationProperties.AccessibilityView="Raw"
                            Source="ms-appx:///Assets/CalculatorAppList.png"/>
                     <TextBlock x:Name="AppName"
                                x:Uid="AppName"
@@ -80,6 +82,7 @@
                                HorizontalAlignment="Left"
                                VerticalAlignment="Center"
                                FontSize="12"
+                               AutomationProperties.AccessibilityView="Raw"
                                TextTrimming="CharacterEllipsis"/>
                 </Grid>
             </Grid>

src/CalculatorUnitTests/NarratorAnnouncementUnitTests.cpp

@@ -177,6 +177,15 @@ namespace CalculatorUnitTests
             VERIFY_ARE_EQUAL(annoucement->Processing, AutomationNotificationProcessing::ImportantMostRecent);
         }
 
+        TEST_METHOD(TestGetSettingsPageOpenedAnnouncement)
+        {
+            auto annoucement = CalculatorAnnouncement::GetSettingsPageOpenedAnnouncement(m_testAnnouncement);
+            VERIFY_ARE_EQUAL(annoucement->Announcement, m_testAnnouncement);
+            VERIFY_ARE_EQUAL(annoucement->ActivityId, L"SettingsPageOpened");
+            VERIFY_ARE_EQUAL(annoucement->Kind, AutomationNotificationKind::ActionCompleted);
+            VERIFY_ARE_EQUAL(annoucement->Processing, AutomationNotificationProcessing::ImportantMostRecent);
+        }
+
     private:
         static const Platform::StringReference m_testAnnouncement;
     };