NumberBox: Visual updates (#5032)

* Visual updates

* Quick accessibility fix -- we need this to run AFTER m_textBox is set.

* Adjusted the size of popup buttons, fixed keyboard focus issue.

* Removed test -- now that corners are only applied to the TextBox, we don't need to worry about which elements have corners anymore.

Author: teaP

dev/NumberBox/APITests/NumberBoxTests.cs

@@ -49,66 +49,6 @@ public void VerifyTextAlignmentPropogates()
             });
         }
 
-        [TestMethod]
-        public void VerifyNumberBoxCornerRadius()
-        {
-            if (Common.PlatformConfiguration.IsOSVersionLessThan(Common.OSVersion.Redstone5))
-            {
-                Log.Warning("NumberBox CornerRadius property is not available pre-rs5");
-                return;
-            }
-
-            var numberBox = SetupNumberBox();
-
-            RepeatButton spinButtonDown = null;
-            TextBox textBox = null;
-            RunOnUIThread.Execute(() =>
-            {
-                // first test: Uniform corner radius of '2' with no spin buttons shown
-                numberBox.SpinButtonPlacementMode = NumberBoxSpinButtonPlacementMode.Hidden;
-                numberBox.CornerRadius = new CornerRadius(2);
-
-                Content.UpdateLayout();
-
-                textBox = TestUtilities.FindDescendents<TextBox>(numberBox).Where(e => e.Name == "InputBox").Single();
-                Verify.AreEqual(new CornerRadius(2, 2, 2, 2), textBox.CornerRadius);
-
-                // second test: Uniform corner radius of '2' with spin buttons in inline mode (T-rule applies now)
-                numberBox.SpinButtonPlacementMode = NumberBoxSpinButtonPlacementMode.Inline;
-                Content.UpdateLayout();
-
-                spinButtonDown = TestUtilities.FindDescendents<RepeatButton>(numberBox).Where(e => e.Name == "DownSpinButton").Single();
-
-                Verify.AreEqual(new CornerRadius(2, 0, 0, 2), textBox.CornerRadius);
-                Verify.AreEqual(new CornerRadius(0, 2, 2, 0), spinButtonDown.CornerRadius);
-
-                // third test: Set uniform corner radius to '4' with spin buttons in inline mode
-                numberBox.CornerRadius = new CornerRadius(4);
-            });
-            IdleSynchronizer.Wait();
-
-            RunOnUIThread.Execute(() =>
-            {
-                // This check makes sure that updating the CornerRadius values of the numberbox in inline mode
-                // does not break the T-rule.
-                Verify.AreEqual(new CornerRadius(4, 0, 0, 4), textBox.CornerRadius);
-                Verify.AreEqual(new CornerRadius(0, 4, 4, 0), spinButtonDown.CornerRadius);
-
-                // fourth test: Update the spin button placement mode to 'compact' and verify that all corners
-                // of the textbox are now rounded again
-                numberBox.SpinButtonPlacementMode = NumberBoxSpinButtonPlacementMode.Compact;
-                Content.UpdateLayout();
-
-                Verify.AreEqual(new CornerRadius(4), textBox.CornerRadius);
-
-                // fifth test: Check corner radius of 0 in compact mode.
-                numberBox.CornerRadius = new CornerRadius(0);
-                Content.UpdateLayout();
-
-                Verify.AreEqual(new CornerRadius(0), textBox.CornerRadius);
-            });
-        }
-
         [TestMethod]
         public void VerifyInputScopePropogates()
         {

dev/NumberBox/NumberBox.cpp

@@ -172,18 +172,6 @@ void NumberBox::OnApplyTemplate()
             }
 
             m_textBoxKeyUpRevoker = textBox.KeyUp(winrt::auto_revoke, { this, &NumberBox::OnNumberBoxKeyUp });
-
-            // Listen to NumberBox::CornerRadius changes so that we can enfore the T-rule for the textbox in SpinButtonPlacementMode::Inline.
-            // We need to explicitly go to the corresponding visual state each time the NumberBox' CornerRadius is changed in order for the new
-            // corner radius values to be filtered correctly.
-            // If we only go to the SpinButtonsVisible visual state whenever the SpinButtonPlacementMode is changed to Inline, all subsequent
-            // corner radius changes would apply to all four textbox corners (this can be easily seen in the CornerRadius test page of the MUXControlsTestApp).
-            // This will break the T-rule in the Inline SpinButtonPlacementMode.
-            if (SharedHelpers::IsControlCornerRadiusAvailable())
-            {
-                m_cornerRadiusChangedRevoker = RegisterPropertyChanged(*this,
-                    winrt::Control::CornerRadiusProperty(), { this, &NumberBox::OnCornerRadiusPropertyChanged });
-            }  
         }
         return textBox;
     }());
@@ -226,6 +214,8 @@ void NumberBox::OnApplyTemplate()
 
     UpdateVisualStateForIsEnabledChange();
 
+    ReevaluateForwardedUIAName();
+
     if (ReadLocalValue(s_ValueProperty) == winrt::DependencyProperty::UnsetValue()
         && ReadLocalValue(s_TextProperty) != winrt::DependencyProperty::UnsetValue())
     {
@@ -238,15 +228,6 @@ void NumberBox::OnApplyTemplate()
     }
 }
 
-void NumberBox::OnCornerRadiusPropertyChanged(const winrt::DependencyObject&, const winrt::DependencyProperty&)
-{
-    if (this->SpinButtonPlacementMode() == winrt::NumberBoxSpinButtonPlacementMode::Inline)
-    {
-        // Enforce T-rule for the textbox in Inline SpinButtonPlacementMode.
-        winrt::VisualStateManager::GoToState(*this, L"SpinButtonsVisible", false);
-    }
-}
-
 void NumberBox::OnValuePropertyChanged(const winrt::DependencyPropertyChangedEventArgs& args)
 {
     // This handler may change Value; don't send extra events in that case.
@@ -643,18 +624,21 @@ void NumberBox::UpdateTextToValue()
 void NumberBox::UpdateSpinButtonPlacement()
 {
     const auto spinButtonMode = SpinButtonPlacementMode();
+    auto state = L"SpinButtonsCollapsed";
 
     if (spinButtonMode == winrt::NumberBoxSpinButtonPlacementMode::Inline)
     {
-        winrt::VisualStateManager::GoToState(*this, L"SpinButtonsVisible", false);
+        state = L"SpinButtonsVisible";
     }
     else if (spinButtonMode == winrt::NumberBoxSpinButtonPlacementMode::Compact)
     {
-        winrt::VisualStateManager::GoToState(*this, L"SpinButtonsPopup", false);
+        state = L"SpinButtonsPopup";
     }
-    else
+
+    winrt::VisualStateManager::GoToState(*this, state, false);
+    if (const auto textbox = m_textBox.get())
     {
-        winrt::VisualStateManager::GoToState(*this, L"SpinButtonsCollapsed", false);
+        winrt::VisualStateManager::GoToState(textbox, state, false);
     }
 }
 

dev/NumberBox/NumberBox.h

@@ -68,7 +68,6 @@ class NumberBox :
     void OnNumberBoxGotFocus(winrt::IInspectable const& sender, winrt::RoutedEventArgs const& args);
     void OnNumberBoxLostFocus(winrt::IInspectable const& sender, winrt::RoutedEventArgs const& args);
     void OnNumberBoxScroll(winrt::IInspectable const& sender, winrt::PointerRoutedEventArgs const& args);
-    void OnCornerRadiusPropertyChanged(const winrt::DependencyObject&, const winrt::DependencyProperty&);
     void OnIsEnabledChanged(const winrt::IInspectable&, const winrt::DependencyPropertyChangedEventArgs&);
     void OnAutomationPropertiesNamePropertyChanged(const winrt::DependencyObject&, const winrt::DependencyProperty&);
 
@@ -112,7 +111,5 @@ class NumberBox :
     winrt::RepeatButton::Click_revoker m_popupUpButtonClickRevoker{};
     winrt::RepeatButton::Click_revoker m_popupDownButtonClickRevoker{};
 
-    PropertyChanged_revoker m_cornerRadiusChangedRevoker{};
-
     winrt::Control::IsEnabledChanged_revoker m_isEnabledChangedRevoker{};
 };