[ColorPicker] Accessibility: Narrator announces color changes in main… (#12369)

* [ColorPicker] Accessibility: Narrator announces color changes in main view

* fixup: Announce color friendly name instead of numbers

src/modules/colorPicker/ColorPickerUI/ViewModels/MainViewModel.cs

@@ -118,10 +118,7 @@ namespace ColorPicker.ViewModels
         {
             ColorBrush = new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
             ColorText = ColorRepresentationHelper.GetStringRepresentation(color, _userSettings.CopiedColorRepresentation.Value);
-            if (_userSettings.ShowColorName.Value)
+            ColorName = ColorNameHelper.GetColorName(color);
-            {
-                ColorName = ColorNameHelper.GetColorName(color);
-            }
         }
 
         /// <summary>

src/modules/colorPicker/ColorPickerUI/Views/MainView.xaml

@@ -35,14 +35,18 @@
                     VerticalAlignment="Stretch"
                     BorderBrush="{DynamicResource WindowBorderBrush}"
                     BorderThickness="1"
-                    x:Name="ColorBorderSmall"
                     CornerRadius="4"/>
 
-                    <TextBlock Margin="8,5,8,8"
+                    <TextBlock 
+                       x:Name="ColorTextBlock"
+                       Margin="8,5,8,8"
                        FontSize="16"
                        FontWeight="SemiBold"
                        Foreground="{DynamicResource PrimaryForegroundBrush}"
                        Grid.Column="1"
+                       AutomationProperties.LiveSetting="Assertive"
+                       AutomationProperties.LabeledBy="{Binding ColorName}" 
+                       AutomationProperties.Name="{Binding ColorName}" 
                        Text="{Binding ColorText}"/>
                 </Grid>
 

src/modules/colorPicker/ColorPickerUI/Views/MainView.xaml.cs

@@ -2,6 +2,9 @@
 // The Microsoft Corporation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using System.ComponentModel;
+using System.Windows;
+using System.Windows.Automation.Peers;
 using System.Windows.Controls;
 
 namespace ColorPicker.Views
@@ -11,7 +14,41 @@ namespace ColorPicker.Views
     /// </summary>
     public partial class MainView : UserControl
     {
+        private void EnableNarratorColorChangesAnnouncements()
+        {
+            INotifyPropertyChanged viewModel = (INotifyPropertyChanged)this.DataContext;
+            viewModel.PropertyChanged += (sender, args) =>
+            {
+                if (args.PropertyName != "ColorName")
+                {
+                    return;
+                }
+
+                var colorTextBlock = (TextBlock)FindName("ColorTextBlock");
+                if (colorTextBlock == null)
+                {
+                    return;
+                }
+
+                var peer = UIElementAutomationPeer.FromElement(colorTextBlock);
+                if (peer == null)
+                {
+                    peer = UIElementAutomationPeer.CreatePeerForElement(colorTextBlock);
+                }
+
+                peer.RaiseAutomationEvent(AutomationEvents.MenuOpened);
+            };
+        }
+
+        private void OnLoaded(object sender, RoutedEventArgs e)
+        {
+            EnableNarratorColorChangesAnnouncements();
+        }
+
         public MainView()
-            => InitializeComponent();
+        {
+            InitializeComponent();
+            Loaded += OnLoaded;
+        }
     }
 }