feat(scrollbar): Add support for ScrollBar

unoplatform · Apr 17, 2020 · 9eadb8e · 9eadb8e
1 parent 69943cf
commit 9eadb8e
Show file tree

Hide file tree

Showing 26 changed files with 2,414 additions and 198 deletions.
diff --git a/doc/articles/supported-features.md b/doc/articles/supported-features.md
@@ -153,6 +153,7 @@
 - MediaPlayer
 - ViewBox
 - PersonPicture
+- ScrollBar
 
 ## WinUI Specific Controls (Pre 3.0)
 - [NumberBox](https://docs.microsoft.com/en-us/uwp/api/microsoft.ui.xaml.controls.numberbox?view=winui-2.3)

diff --git a/...esApp/SamplesApp.UITests/Windows_UI_Xaml_Controls/ScrollBar/UnoSamples_Tests.ScrollBar.cs b/...esApp/SamplesApp.UITests/Windows_UI_Xaml_Controls/ScrollBar/UnoSamples_Tests.ScrollBar.cs
@@ -0,0 +1,180 @@
+using System;
+using System.Collections.Generic;
+using System.Diagnostics.SymbolStore;
+using System.Drawing;
+using System.Linq;
+using System.Runtime.Versioning;
+using System.Text;
+using System.Text.RegularExpressions;
+using System.Threading.Tasks;
+using NUnit.Framework;
+using SamplesApp.UITests.TestFramework;
+using Uno.UITest.Helpers;
+using Uno.UITest.Helpers.Queries;
+
+namespace SamplesApp.UITests.Windows_UI_Xaml_Controls.ScrollViewerTests
+{
+	[TestFixture]
+	public class UnoSamplesTests_ScrollBar : SampleControlUITestBase
+	{
+		[Test]
+		[AutoRetry]
+		public void ScrollBar_Vertical()
+		{
+			Run("UITests.Windows_UI_Xaml_Controls.ScrollBar.ScrollBar_Simple");
+
+			var indicatorModeCombo = _app.Marked("IndicatorModeCombo");
+			var verticalScrollBar = _app.Marked("VerticalScrollBar");
+			var verticalValue = _app.Marked("VerticalValue");
+			var scrollValue = _app.Marked("scrollValue");
+
+			var verticalScrollBarThumb = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalThumb");
+			var verticalScrollBarSmallDecrease = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalSmallDecrease");
+			var verticalScrollBarLargeDecrease = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalLargeDecrease");
+			var verticalScrollBarSmallIncrease = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalSmallIncrease");
+			var verticalScrollBarLargeIncrease = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalLargeIncrease");
+
+			_app.WaitForElement(indicatorModeCombo);
+
+			TakeScreenshot("Startup");
+
+			indicatorModeCombo.SetDependencyPropertyValue("SelectedValue", "MouseIndicator");
+
+			TakeScreenshot("initial indicators");
+
+			verticalScrollBarSmallDecrease.FastTap();
+
+			_app.WaitForText(verticalValue, "99.9");
+			_app.WaitForText(scrollValue, "Vertical Scroll: SmallDecrement, 99.9");
+
+			verticalScrollBarLargeDecrease.FastTap();
+
+			_app.WaitForText(verticalValue, "98.9");
+			_app.WaitForText(scrollValue, "Vertical Scroll: LargeDecrement, 98.9");
+
+			verticalScrollBarSmallIncrease.FastTap();
+
+			_app.WaitForText(verticalValue, "99");
+			_app.WaitForText(scrollValue, "Vertical Scroll: SmallIncrement, 99");
+
+			verticalScrollBarLargeIncrease.FastTap();
+
+			_app.WaitForText(verticalValue, "100");
+			_app.WaitForText(scrollValue, "Vertical Scroll: LargeIncrement, 100");
+		}
+
+		[Test]
+		[AutoRetry]
+		public void ScrollBar_Horizontal()
+		{
+			Run("UITests.Windows_UI_Xaml_Controls.ScrollBar.ScrollBar_Simple");
+
+			var indicatorModeCombo = _app.Marked("IndicatorModeCombo");
+			var horizontalScrollBar = _app.Marked("HorizontalScrollBar");
+			var horizontalValue = _app.Marked("HorizontalValue");
+			var scrollValue = _app.Marked("scrollValue");
+
+			var horizontalScrollBarThumb = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalThumb");
+			var horizontalScrollBarSmallDecrease = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalSmallDecrease");
+			var horizontalScrollBarLargeDecrease = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalLargeDecrease");
+			var horizontalScrollBarSmallIncrease = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalSmallIncrease");
+			var horizontalScrollBarLargeIncrease = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalLargeIncrease");
+
+			_app.WaitForElement(indicatorModeCombo);
+
+			TakeScreenshot("Startup");
+
+			indicatorModeCombo.SetDependencyPropertyValue("SelectedValue", "MouseIndicator");
+
+			TakeScreenshot("initial indicators");
+
+			horizontalScrollBarSmallDecrease.FastTap();
+
+			_app.WaitForText(horizontalValue, "99.9");
+			_app.WaitForText(scrollValue, "Horizontal Scroll: SmallDecrement, 99.9");
+
+			horizontalScrollBarLargeDecrease.FastTap();
+
+			_app.WaitForText(horizontalValue, "98.9");
+			_app.WaitForText(scrollValue, "Horizontal Scroll: LargeDecrement, 98.9");
+
+			horizontalScrollBarSmallIncrease.FastTap();
+
+			_app.WaitForText(horizontalValue, "99");
+			_app.WaitForText(scrollValue, "Horizontal Scroll: SmallIncrement, 99");
+
+			horizontalScrollBarLargeIncrease.FastTap();
+
+			_app.WaitForText(horizontalValue, "100");
+			_app.WaitForText(scrollValue, "Horizontal Scroll: LargeIncrement, 100");
+		}
+
+		[Test]
+		[AutoRetry]
+		[ActivePlatforms(Platform.iOS, Platform.Browser)] // Android: https://github.com/unoplatform/uno/issues/3009
+		public void ScrollBar_HorizontalThumb()
+		{
+			Run("UITests.Windows_UI_Xaml_Controls.ScrollBar.ScrollBar_Simple");
+
+			var indicatorModeCombo = _app.Marked("IndicatorModeCombo");
+			var horizontalScrollBar = _app.Marked("HorizontalScrollBar");
+			var horizontalValue = _app.Marked("HorizontalValue");
+			var scrollValue = _app.Marked("scrollValue");
+
+			var horizontalScrollBarThumb = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalThumb");
+			var horizontalScrollBarSmallDecrease = _app.Marked("HorizontalScrollBar").Descendant().Marked("HorizontalSmallDecrease");
+
+			_app.WaitForElement(indicatorModeCombo);
+
+			TakeScreenshot("Startup");
+
+			indicatorModeCombo.SetDependencyPropertyValue("SelectedValue", "MouseIndicator");
+
+			TakeScreenshot("initial indicators");
+
+			var thumbResult = _app.Query(horizontalScrollBarThumb).First();
+
+			horizontalScrollBarSmallDecrease.FastTap();
+			_app.WaitForText(horizontalValue, "99.9");
+
+			_app.DragCoordinates(thumbResult.Rect.CenterX, thumbResult.Rect.CenterY, thumbResult.Rect.CenterX + 10, thumbResult.Rect.CenterY);
+
+			_app.WaitForText(horizontalValue, "126.56666666666668");
+			_app.WaitForText(scrollValue, "Horizontal Scroll: EndScroll, 126.566666666667");
+		}
+
+		[Test]
+		[AutoRetry]
+		[ActivePlatforms(Platform.iOS, Platform.Browser)] // Android: https://github.com/unoplatform/uno/issues/3009
+		public void ScrollBar_VerticalThumb()
+		{
+			Run("UITests.Windows_UI_Xaml_Controls.ScrollBar.ScrollBar_Simple");
+
+			var indicatorModeCombo = _app.Marked("IndicatorModeCombo");
+			var verticalScrollBar = _app.Marked("VerticalScrollBar");
+			var verticalValue = _app.Marked("VerticalValue");
+			var scrollValue = _app.Marked("scrollValue");
+
+			var verticalScrollBarThumb = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalThumb");
+			var verticalScrollBarSmallDecrease = _app.Marked("VerticalScrollBar").Descendant().Marked("VerticalSmallDecrease");
+
+			_app.WaitForElement(indicatorModeCombo);
+
+			TakeScreenshot("Startup");
+
+			indicatorModeCombo.SetDependencyPropertyValue("SelectedValue", "MouseIndicator");
+
+			TakeScreenshot("initial indicators");
+
+			var thumbResult = _app.Query(verticalScrollBarThumb).First();
+
+			verticalScrollBarSmallDecrease.FastTap();
+			_app.WaitForText(verticalValue, "99.9");
+
+			_app.DragCoordinates(thumbResult.Rect.CenterX, thumbResult.Rect.CenterY, thumbResult.Rect.CenterX, thumbResult.Rect.CenterY + 10);
+
+			_app.WaitForText(verticalValue, "126.56666666666668");
+			_app.WaitForText(scrollValue, "Vertical Scroll: EndScroll, 126.566666666667");
+		}
+	}
+}
diff --git a/src/SamplesApp/UITests.Shared/UITests.Shared.projitems b/src/SamplesApp/UITests.Shared/UITests.Shared.projitems
@@ -833,6 +833,10 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
+    <Page Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\ScrollBar\ScrollBar_Simple.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\ScrollViewerTests\ScrollViewer_Clipping.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -3632,6 +3636,9 @@
     <Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\RepeatButton\RepeatButton_Automated.xaml.cs">
       <DependentUpon>RepeatButton_Automated.xaml</DependentUpon>
     </Compile>
+    <Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\ScrollBar\ScrollBar_Simple.xaml.cs">
+      <DependentUpon>ScrollBar_Simple.xaml</DependentUpon>
+    </Compile>
     <Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\ScrollViewerTests\ScrollViewer_Clipping.xaml.cs">
       <DependentUpon>ScrollViewer_Clipping.xaml</DependentUpon>
     </Compile>

diff --git a/src/SamplesApp/UITests.Shared/Windows_UI_Xaml_Controls/ScrollBar/ScrollBar_Simple.xaml b/src/SamplesApp/UITests.Shared/Windows_UI_Xaml_Controls/ScrollBar/ScrollBar_Simple.xaml
@@ -0,0 +1,72 @@
+<Page
+    x:Class="UITests.Windows_UI_Xaml_Controls.ScrollBar.ScrollBar_Simple"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:UITests.Windows_UI_Xaml_Controls.ScrollBar"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+
+    <Grid>
+		<Grid.ColumnDefinitions>
+			<ColumnDefinition Width="*" />
+			<ColumnDefinition Width="*" />
+		</Grid.ColumnDefinitions>
+		<StackPanel>
+			<ComboBox x:Name="IndicatorModeCombo" SelectedValue="MouseIndicator">
+				<x:String>None</x:String>
+				<x:String>MouseIndicator</x:String>
+				<x:String>TouchIndicator</x:String>
+			</ComboBox>
+			<TextBlock Text="HValue" />
+			<TextBlock x:Name="HorizontalValue" Text="{x:Bind HorizontalScrollBar.Value, Mode=OneWay}" />
+			<TextBlock Text="VValue" />
+			<TextBlock x:Name="VerticalValue" Text="{x:Bind VerticalScrollBar.Value, Mode=OneWay}" />
+			<TextBlock Text="ScrollValue" />
+			<TextBlock x:Name="scrollValue" Text="None" />
+		</StackPanel>
+
+		<Grid Width="200" Height="200" Grid.Column="1" BorderBrush="Black" BorderThickness="1">
+			<Grid.ColumnDefinitions>
+				<ColumnDefinition Width="*" />
+				<ColumnDefinition Width="Auto" />
+			</Grid.ColumnDefinitions>
+			<Grid.RowDefinitions>
+				<RowDefinition Height="*" />
+				<RowDefinition Height="Auto" />
+			</Grid.RowDefinitions>
+
+			<Border Background="Yellow" />
+
+			<ScrollBar x:Name="VerticalScrollBar"
+							Grid.Column="1"
+							IsTabStop="False"
+							Maximum="200"
+							Orientation="Vertical"
+							Visibility="Visible"
+							IndicatorMode="{Binding SelectedValue, ElementName=IndicatorModeCombo, Mode=OneWay}"
+							Scroll="OnVerticalScroll"
+							Value="100"
+							ViewportSize="200" 
+							HorizontalAlignment="Right" />
+
+			<ScrollBar x:Name="HorizontalScrollBar"
+							IsTabStop="False"
+							Maximum="200"
+							IndicatorMode="{Binding SelectedValue, ElementName=IndicatorModeCombo, Mode=OneWay}"
+							Scroll="OnHorizontalScroll"
+							Orientation="Horizontal"
+							Grid.Row="1"
+							Visibility="Visible"
+							Value="100"
+							ViewportSize="200" />
+
+			<Border x:Name="ScrollBarSeparator"
+						Grid.Row="1"
+						Grid.Column="1"
+						Background="{ThemeResource SystemControlPageBackgroundChromeLowBrush}" />
+		</Grid>
+
+    </Grid>
+</Page>
diff --git a/src/SamplesApp/UITests.Shared/Windows_UI_Xaml_Controls/ScrollBar/ScrollBar_Simple.xaml.cs b/src/SamplesApp/UITests.Shared/Windows_UI_Xaml_Controls/ScrollBar/ScrollBar_Simple.xaml.cs
@@ -0,0 +1,42 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Linq;
+using System.Runtime.InteropServices.WindowsRuntime;
+using Uno.UI.Samples.Controls;
+using Windows.Foundation;
+using Windows.Foundation.Collections;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Input;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Navigation;
+
+// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=234238
+
+namespace UITests.Windows_UI_Xaml_Controls.ScrollBar
+{
+	/// <summary>
+	/// An empty page that can be used on its own or navigated to within a Frame.
+	/// </summary>
+	[SampleControlInfo("ScrollBar")]
+	public sealed partial class ScrollBar_Simple : Page
+	{
+		public ScrollBar_Simple()
+		{
+			this.InitializeComponent();
+		}
+
+		public void OnVerticalScroll(object sender, ScrollEventArgs args)
+		{
+			scrollValue.Text = $"Vertical Scroll: {args.ScrollEventType}, {args.NewValue}";
+		}
+
+		public void OnHorizontalScroll(object sender, ScrollEventArgs args)
+		{
+			scrollValue.Text = $"Horizontal Scroll: {args.ScrollEventType}, {args.NewValue}";
+		}
+	}
+}