fix(listview): [WASM [Skia] Trim excess scroll when item at end of list is removed

Author: davidjohnoliver

src/Uno.UI.RuntimeTests/Tests/Windows_UI_Xaml_Controls/Given_ListViewBase.cs

@@ -20,6 +20,7 @@
 using Windows.UI.Xaml.Controls;
 using Windows.UI.Xaml.Controls.Primitives;
 using static Private.Infrastructure.TestServices;
+using Windows.Foundation;
 
 namespace Uno.UI.RuntimeTests.Tests.Windows_UI_Xaml_Controls
 {
@@ -33,6 +34,8 @@ public partial class Given_ListViewBase
 
 		private Style ContainerMarginStyle => _testsResources["ListViewContainerMarginStyle"] as Style;
 
+		private Style NoSpaceContainerStyle => _testsResources["NoExtraSpaceListViewContainerStyle"] as Style;
+
 		private DataTemplate TextBlockItemTemplate => _testsResources["TextBlockItemTemplate"] as DataTemplate;
 
 		private DataTemplate SelfHostingItemTemplate => _testsResources["SelfHostingItemTemplate"] as DataTemplate;
@@ -538,7 +541,8 @@ public async Task When_CollectionViewSource_In_Xaml()
 			await WindowHelper.WaitFor(() => (lvi = page.SubjectListView.ContainerFromItem("One") as ListViewItem) != null);
 		}
 
-		private static ContentControl[] GetPanelChildren(ListViewBase list) {
+		private static ContentControl[] GetPanelChildren(ListViewBase list)
+		{
 #if __ANDROID__ || __IOS__
 			return list.GetItemsPanelChildren().OfType<ContentControl>().ToArray();
 #else
@@ -610,5 +614,47 @@ public void When_Selection_SelectedValue_Path_Not_Set()
 			Assert.AreEqual(null, SUT.SelectedItem);
 			Assert.AreEqual(-1, SUT.SelectedIndex);
 		}
+
+		[TestMethod]
+		public async Task When_Scrolled_To_End_And_Last_Item_Removed()
+		{
+			var container = new Grid { Height = 210 };
+
+			var list = new ListView
+			{
+				ItemContainerStyle = NoSpaceContainerStyle,
+				ItemTemplate = FixedSizeItemTemplate
+			};
+			container.Children.Add(list);
+
+			var source = new ObservableCollection<int>(Enumerable.Range(0, 20));
+			list.ItemsSource = source;
+
+			WindowHelper.WindowContent = container;
+			await WindowHelper.WaitForLoaded(list);
+
+			ScrollBy(list, 10000); // Scroll to end
+
+			ListViewItem lastItem = null;
+			await WindowHelper.WaitFor(() => (lastItem = list.ContainerFromItem(19) as ListViewItem) != null);
+			var secondLastItem = list.ContainerFromItem(18) as ListViewItem;
+
+			Assert.AreEqual(181, GetTop(lastItem), delta: 1);
+			Assert.AreEqual(152, GetTop(secondLastItem), delta: 1);
+
+			source.Remove(19);
+
+			await WindowHelper.WaitFor(() => list.Items.Count == 19);
+
+			await WindowHelper.WaitFor(() => ApproxEquals(181, GetTop(secondLastItem)), message: $"Expected 181 but got {GetTop(secondLastItem)}");
+
+			double GetTop(FrameworkElement element)
+			{
+				var transform = element.TransformToVisual(container);
+				return transform.TransformPoint(new Point()).Y;
+			}
+		}
+
+		private bool ApproxEquals(double value1, double value2) => Math.Abs(value1 - value2) <= 1;
 	}
 }

src/Uno.UI.RuntimeTests/Tests/Windows_UI_Xaml_Controls/TestsResources.xaml

@@ -16,6 +16,23 @@
 			</Setter.Value>
 		</Setter>
 	</Style>
+	<Style x:Key="NoExtraSpaceListViewContainerStyle"
+		   TargetType="ListViewItem">
+		<Setter Property="Padding"
+				Value="0" />
+		<Setter Property="MinWidth"
+				Value="0" />
+		<Setter Property="MinHeight"
+				Value="1" />
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="ListViewItem">
+					<ContentPresenter Content="{TemplateBinding Content}"
+									  ContentTemplate="{TemplateBinding ContentTemplate}" />
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
 	<Style x:Key="CounterItemsControlContainerStyle"
 		   TargetType="ContentControl">
 		<Setter Property="Template">

src/Uno.UI/UI/Xaml/Controls/ScrollViewer/ScrollViewer.cs

@@ -636,9 +636,14 @@ protected override Size ArrangeOverride(Size finalSize)
 		{
 			ViewportArrangeSize = finalSize;
 
-			return base.ArrangeOverride(finalSize);
+			var arrangeSize = base.ArrangeOverride(finalSize);
+			TrimOverscroll(Orientation.Horizontal);
+			TrimOverscroll(Orientation.Vertical);
+			return arrangeSize;
 		}
 
+		partial void TrimOverscroll(Orientation orientation);
+
 		internal override void OnLayoutUpdated()
 		{
 			base.OnLayoutUpdated();
@@ -795,7 +800,6 @@ protected override void OnApplyTemplate()
 		{
 			// Cleanup previous template
 			DetachScrollBars();
-			
 
 			base.OnApplyTemplate();
 
@@ -886,7 +890,7 @@ private void ApplyScrollContentPresenterContent()
 					provider.Store.SetValue(provider.Store.TemplatedParentProperty, null, DependencyPropertyValuePrecedences.Local);
 				}
 			}
-			
+
 			// Then explicitly propagate the Content to the _presenter
 			if (_presenter != null)
 			{
@@ -1040,7 +1044,7 @@ private void AttachScrollBars()
 			}
 
 			bool hasManagedHorizontalScrollBar;
-			if (_horizontalScrollbar is {} horizontal)
+			if (_horizontalScrollbar is { } horizontal)
 			{
 				horizontal.Scroll += OnHorizontalScrollBarScrolled;
 				hasManagedHorizontalScrollBar = true;
@@ -1094,7 +1098,7 @@ private void OnHorizontalScrollBarScrolled(object sender, ScrollEventArgs e)
 			};
 
 			ChangeViewScroll(e.NewValue, null, disableAnimation: immediate);
-		} 
+		}
 		#endregion
 
 		// Presenter to Control, i.e. OnPresenterScrolled
@@ -1152,6 +1156,8 @@ private void Update(bool isIntermediate)
 			HorizontalOffset = _pendingHorizontalOffset;
 			VerticalOffset = _pendingVerticalOffset;
 
+			UpdatePartial(isIntermediate);
+
 #if !__SKIA__
 			// Effective viewport support
 			ScrollOffsets = new Point(_pendingHorizontalOffset, _pendingVerticalOffset);
@@ -1161,6 +1167,8 @@ private void Update(bool isIntermediate)
 			ViewChanged?.Invoke(this, new ScrollViewerViewChangedEventArgs { IsIntermediate = isIntermediate });
 		}
 
+		partial void UpdatePartial(bool isIntermediate);
+
 		/// <summary>
 		/// Causes the ScrollViewer to load a new view into the viewport using the specified offsets and zoom factor, and optionally disables scrolling animation.
 		/// </summary>
@@ -1205,7 +1213,7 @@ public bool ChangeView(double? horizontalOffset, double? verticalOffset, float?
 		partial void ChangeViewScroll(double? horizontalOffset, double? verticalOffset, bool disableAnimation);
 		partial void ChangeViewZoom(float zoomFactor, bool disableAnimation);
 
-				#region Scroll indicators visual states (Managed scroll bars only)
+		#region Scroll indicators visual states (Managed scroll bars only)
 		private DispatcherQueueTimer? _indicatorResetTimer;
 		private string? _indicatorState;
 
@@ -1255,7 +1263,7 @@ private void ResetScrollIndicator(bool forced = false)
 			{
 				// We don't auto hide the indicators if the pointer is over it!
 				// Note: the pointer has to move over this ScrollViewer to exit the ScrollBar, so we will restart the reset timer!
-				return; 
+				return;
 			}
 
 			VisualStateManager.GoToState(this, VisualStates.ScrollingIndicator.None, true);
@@ -1284,6 +1292,6 @@ private void HideScrollBarSeparator(object sender, PointerRoutedEventArgs e) //
 				VisualStateManager.GoToState(this, VisualStates.ScrollBarsSeparator.Collapsed, true);
 			}
 		}
-				#endregion
+		#endregion
 	}
 }

src/Uno.UI/UI/Xaml/Controls/ScrollViewer/ScrollViewer.netstd.cs

@@ -0,0 +1,55 @@
+#nullable enable
+using Windows.UI.Xaml.Controls;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Media.Animation;
+using Windows.Foundation;
+using Windows.UI;
+
+namespace Windows.UI.Xaml.Controls
+{
+	public partial class ScrollViewer
+	{
+		/// <summary>
+		/// Trim excess scroll, which can be present if the content size is reduced.
+		/// </summary>
+		partial void TrimOverscroll(Orientation orientation)
+		{
+			if (_presenter is ContentPresenter presenter && presenter.Content is FrameworkElement presenterContent)
+			{
+				var presenterViewportSize = GetActualExtent(presenter, orientation);
+				var contentExtent = GetActualExtent(presenterContent, orientation);
+				var offset = GetOffsetForOrientation(orientation);
+				var viewportEnd = offset + presenterViewportSize;
+				var overscroll = contentExtent - viewportEnd;
+				if (offset > 0 && overscroll < -0.5)
+				{
+					ChangeViewForOrientation(orientation, overscroll);
+				}
+			}
+		}
+
+		private double GetOffsetForOrientation(Orientation orientation)
+			=> orientation == Orientation.Horizontal ? HorizontalOffset : VerticalOffset;
+
+		private void ChangeViewForOrientation(Orientation orientation, double scrollAdjustment)
+		{
+			if (orientation == Orientation.Vertical)
+			{
+				ChangeView(null, VerticalOffset + scrollAdjustment, null, disableAnimation: true);
+			}
+			else
+			{
+				ChangeView(HorizontalOffset + scrollAdjustment, null, null, disableAnimation: true);
+			}
+		}
+
+		private static double GetActualExtent(FrameworkElement element, Orientation orientation)
+			=> orientation == Orientation.Horizontal ? element.ActualWidth : element.ActualHeight;
+	}
+}

src/Uno.UI/UI/Xaml/Controls/ScrollViewer/ScrollViewer.wasm.cs

@@ -4,6 +4,7 @@
 using Microsoft.Extensions.Logging;
 using Uno.Logging;
 using Uno.UI.Xaml;
+using Uno.UI;
 
 namespace Windows.UI.Xaml.Controls
 {
@@ -31,5 +32,14 @@ partial void ChangeViewScroll(double? horizontalOffset, double? verticalOffset,
 				_log.Warn("Cannot ChangeView as ScrollContentPresenter is not ready yet.");
 			}
 		}
+
+		partial void UpdatePartial(bool isIntermediate)
+		{
+			if (FeatureConfiguration.UIElement.AssignDOMXamlProperties)
+			{
+				UpdateDOMXamlProperty(nameof(HorizontalOffset), HorizontalOffset);
+				UpdateDOMXamlProperty(nameof(VerticalOffset), VerticalOffset);
+			}
+		}
 	}
 }