TabView: Add tooltips to its scrolling buttons. (#2369)

* Add tooltips to TabView's scrolling buttons. * Add interaction test. * Changed order to get correct <expected><actual> structure. * Removed empty line.
microsoft · May 7, 2020 · d14b639 · d14b639
1 parent 74aa5f2
commit d14b639
Show file tree

Hide file tree

Showing 6 changed files with 84 additions and 10 deletions.
diff --git a/dev/ResourceHelper/ResourceAccessor.h b/dev/ResourceHelper/ResourceAccessor.h
@@ -157,6 +157,8 @@ class ResourceAccessor sealed
 #define SR_TabViewCloseButtonName L"TabViewCloseButtonName"
 #define SR_TabViewCloseButtonTooltip L"TabViewCloseButtonTooltip"
 #define SR_TabViewCloseButtonTooltipWithKA L"TabViewCloseButtonTooltipWithKA"
+#define SR_TabViewScrollDecreaseButtonTooltip L"TabViewScrollDecreaseButtonTooltip"
+#define SR_TabViewScrollIncreaseButtonTooltip L"TabViewScrollIncreaseButtonTooltip"
 #define SR_NumberBoxUpSpinButtonName L"NumberBoxUpSpinButtonName"
 #define SR_NumberBoxDownSpinButtonName L"NumberBoxDownSpinButtonName"
 

diff --git a/dev/TabView/InteractionTests/TabViewTests.cs b/dev/TabView/InteractionTests/TabViewTests.cs
@@ -623,13 +623,23 @@ public void SizingTest()
  }
  }
 
+ [TestMethod]
+ public void ScrollButtonToolTipTest()
+ {
+ using (var setup = new TestSetupHelper("TabView Tests"))
+ {
+ PressButtonAndVerifyText("GetScrollDecreaseButtonToolTipButton", "ScrollDecreaseButtonToolTipTextBlock", "Scroll tab list backward");
+ PressButtonAndVerifyText("GetScrollIncreaseButtonToolTipButton", "ScrollIncreaseButtonToolTipTextBlock", "Scroll tab list forward");
+ }
+ }
+
  public void PressButtonAndVerifyText(String buttonName, String textBlockName, String expectedText)
  {
  Button button = FindElement.ByName<Button>(buttonName);
  button.InvokeAndWait();
 
  TextBlock textBlock = FindElement.ByName<TextBlock>(textBlockName);
- Verify.AreEqual(textBlock.DocumentText, expectedText);
+ Verify.AreEqual(expectedText, textBlock.DocumentText);
  }
 
  Button FindCloseButton(UIObject tabItem)

diff --git a/dev/TabView/Strings/en-us/Resources.resw b/dev/TabView/Strings/en-us/Resources.resw
@@ -137,4 +137,12 @@
  <value>Close tab (Ctrl+F4)</value>
  <comment>Tooltip for the close button on each tab (with keyboard accelerator).</comment>
  </data>
+ <data name="TabViewScrollDecreaseButtonTooltip" xml:space="preserve">
+ <value>Scroll tab list backward</value>
+ <comment>Tooltip for the tab list scroll decrease button.</comment>
+ </data>
+ <data name="TabViewScrollIncreaseButtonTooltip" xml:space="preserve">
+ <value>Scroll tab list forward</value>
+ <comment>Tooltip for the tab list scroll increase button.</comment>
+ </data>
 </root>
diff --git a/dev/TabView/TabView.cpp b/dev/TabView/TabView.cpp
@@ -345,13 +345,41 @@ void TabView::OnScrollViewerLoaded(const winrt::IInspectable&, const winrt::Rout
 {
  if (auto&& scrollViewer = m_scrollViewer.get())
  {
- auto decreaseButton = SharedHelpers::FindInVisualTreeByName(scrollViewer, L"ScrollDecreaseButton").as<winrt::RepeatButton>();
- m_scrollDecreaseButton.set(decreaseButton);
- m_scrollDecreaseClickRevoker = decreaseButton.Click(winrt::auto_revoke, { this, &TabView::OnScrollDecreaseClick });
+ m_scrollDecreaseButton.set([this, scrollViewer]() {
+ const auto decreaseButton = SharedHelpers::FindInVisualTreeByName(scrollViewer, L"ScrollDecreaseButton").as<winrt::RepeatButton>();
+ if (decreaseButton)
+ {
+ // Do localization for the scroll decrease button
+ const auto toolTip = winrt::ToolTipService::GetToolTip(decreaseButton);
+ if (!toolTip)
+ {
+ const auto tooltip = winrt::ToolTip();
+ tooltip.Content(box_value(ResourceAccessor::GetLocalizedStringResource(SR_TabViewScrollDecreaseButtonTooltip)));
+ winrt::ToolTipService::SetToolTip(decreaseButton, tooltip);
+ }
+
+ m_scrollDecreaseClickRevoker = decreaseButton.Click(winrt::auto_revoke, { this, &TabView::OnScrollDecreaseClick });
+ }
+ return decreaseButton;
+ }());
 
- auto increaseButton = SharedHelpers::FindInVisualTreeByName(scrollViewer, L"ScrollIncreaseButton").as<winrt::RepeatButton>();
- m_scrollIncreaseButton.set(increaseButton);
- m_scrollIncreaseClickRevoker = increaseButton.Click(winrt::auto_revoke, { this, &TabView::OnScrollIncreaseClick });
+ m_scrollIncreaseButton.set([this, scrollViewer]() {
+ const auto increaseButton = SharedHelpers::FindInVisualTreeByName(scrollViewer, L"ScrollIncreaseButton").as<winrt::RepeatButton>();
+ if (increaseButton)
+ {
+ // Do localization for the scroll increase button
+ const auto toolTip = winrt::ToolTipService::GetToolTip(increaseButton);
+ if (!toolTip)
+ {
+ const auto tooltip = winrt::ToolTip();
+ tooltip.Content(box_value(ResourceAccessor::GetLocalizedStringResource(SR_TabViewScrollIncreaseButtonTooltip)));
+ winrt::ToolTipService::SetToolTip(increaseButton, tooltip);
+ }
+
+ m_scrollIncreaseClickRevoker = increaseButton.Click(winrt::auto_revoke, { this, &TabView::OnScrollIncreaseClick });
+ }
+ return increaseButton;
+ }());
 
  m_scrollViewerViewChangedRevoker = scrollViewer.ViewChanged(winrt::auto_revoke, { this, &TabView::OnScrollViewerViewChanged });
  }

diff --git a/dev/TabView/TestUI/TabViewPage.xaml b/dev/TabView/TestUI/TabViewPage.xaml
@@ -99,6 +99,16 @@
  <Button x:Name="GetFirstTabLocationButton" AutomationProperties.Name="GetFirstTabLocationButton" Content="FirstTab" Click="GetFirstTabLocationButton_Click"/>
  <TextBlock x:Name="FirstTabLocationTextBlock" AutomationProperties.Name="FirstTabLocationTextBlock" Margin="4,0,0,0" Text=""/>
  </StackPanel>
+
+ <StackPanel Orientation="Horizontal" Margin="0,0,0,8">
+ <Button x:Name="GetScrollDecreaseButtonToolTipButton" AutomationProperties.Name="GetScrollDecreaseButtonToolTipButton" Content="TooltipScrollDecreaseButton" Click="GetScrollDecreaseButtonToolTipButton_Click"/>
+ <TextBlock x:Name="ScrollDecreaseButtonToolTipTextBlock" AutomationProperties.Name="ScrollDecreaseButtonToolTipTextBlock" Margin="4,0,0,0" Text=""/>
+ </StackPanel>
+
+ <StackPanel Orientation="Horizontal" Margin="0,0,0,8">
+ <Button x:Name="GetScrollIncreaseButtonToolTipButton" AutomationProperties.Name="GetScrollIncreaseButtonToolTipButton" Content="TooltipScrollIncreaseButton" Click="GetScrollIncreaseButtonToolTipButton_Click"/>
+ <TextBlock x:Name="ScrollIncreaseButtonToolTipTextBlock" AutomationProperties.Name="ScrollIncreaseButtonToolTipTextBlock" Margin="4,0,0,0" Text=""/>
+ </StackPanel>
  </StackPanel>
 
  <Grid Grid.Column="1">

diff --git a/dev/TabView/TestUI/TabViewPage.xaml.cs b/dev/TabView/TestUI/TabViewPage.xaml.cs
@@ -142,15 +142,15 @@ public void CustomTooltipButton_Click(object sender, RoutedEventArgs e)
 
  public void GetTab0ToolTipButton_Click(object sender, RoutedEventArgs e)
  {
- GetToolTipStringForTab(FirstTab, Tab0ToolTipTextBlock);
+ GetToolTipStringForUIElement(FirstTab, Tab0ToolTipTextBlock);
  }
 
  public void GetTab1ToolTipButton_Click(object sender, RoutedEventArgs e)
  {
- GetToolTipStringForTab(SecondTab, Tab1ToolTipTextBlock);
+ GetToolTipStringForUIElement(SecondTab, Tab1ToolTipTextBlock);
  }
 
- public void GetToolTipStringForTab(TabViewItem item, TextBlock textBlock)
+ public void GetToolTipStringForUIElement(UIElement item, TextBlock textBlock)
  {
  var tooltip = ToolTipService.GetToolTip(item);
  if (tooltip is ToolTip)
@@ -399,5 +399,21 @@ private void ShortLongTextButton_Click(object sender, RoutedEventArgs e)
  FirstTab.Header = "s";
  LongHeaderTab.Header = "long long long long long long long long";
  }
+
+ private void GetScrollDecreaseButtonToolTipButton_Click(object sender, RoutedEventArgs e)
+ {
+ if (VisualTreeUtils.FindVisualChildByName(Tabs, "ScrollDecreaseButton") is RepeatButton scrollDecreaseButton)
+ {
+ GetToolTipStringForUIElement(scrollDecreaseButton, ScrollDecreaseButtonToolTipTextBlock);
+ }
+ }
+
+ private void GetScrollIncreaseButtonToolTipButton_Click(object sender, RoutedEventArgs e)
+ {
+ if (VisualTreeUtils.FindVisualChildByName(Tabs, "ScrollIncreaseButton") is RepeatButton scrollIncreaseButton)
+ {
+ GetToolTipStringForUIElement(scrollIncreaseButton, ScrollIncreaseButtonToolTipTextBlock);
+ }
+ }
  }
 }