Skip to content

Commit

Permalink
NumberBox: Visual updates (#5032)
Browse files Browse the repository at this point in the history
* 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.
  • Loading branch information
teaP authored May 21, 2021
1 parent 4fc34de commit a43a2ab
Show file tree
Hide file tree
Showing 5 changed files with 140 additions and 111 deletions.
60 changes: 0 additions & 60 deletions dev/NumberBox/APITests/NumberBoxTests.cs
Original file line number Diff line number Diff line change
Expand Up @@ -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()
{
Expand Down
34 changes: 9 additions & 25 deletions dev/NumberBox/NumberBox.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}());
Expand Down Expand Up @@ -226,6 +214,8 @@ void NumberBox::OnApplyTemplate()

UpdateVisualStateForIsEnabledChange();

ReevaluateForwardedUIAName();

if (ReadLocalValue(s_ValueProperty) == winrt::DependencyProperty::UnsetValue()
&& ReadLocalValue(s_TextProperty) != winrt::DependencyProperty::UnsetValue())
{
Expand All @@ -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.
Expand Down Expand Up @@ -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);
}
}

Expand Down
3 changes: 0 additions & 3 deletions dev/NumberBox/NumberBox.h
Original file line number Diff line number Diff line change
Expand Up @@ -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&);

Expand Down Expand Up @@ -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{};
};
Loading

0 comments on commit a43a2ab

Please sign in to comment.