[Windows] Fix CollectionView selected item visibility (#31126)

* Fixed CollectionView multiselection.

* updated StructuredItemsViewHandler.Windows.cs

* added UI test.

* added snapshots.

* Update StructuredItemsViewHandler.Windows.cs

* updated review concerns.

* added snapshots.

* Updated test

* removed existing output images.

* snapshots added.

* Update Issue30868.cs

* Update Issue30868.cs

* added windows snapshot.

Author: Vignesh-SF3580

src/Controls/src/Core/Handlers/Items/StructuredItemsViewHandler.Windows.cs

@@ -18,6 +18,10 @@ public partial class StructuredItemsViewHandler<TItemsView> : ItemsViewHandler<T
 		View _currentFooter;
 		WeakNotifyPropertyChangedProxy _layoutPropertyChangedProxy;
 		PropertyChangedEventHandler _layoutPropertyChanged;
+		const string ListViewItemStyleKey = "DefaultListViewItemStyle";
+		const string GridViewItemStyleKey = "DefaultGridViewItemStyle";
+		static WStyle _listViewItemStyle;
+		static WStyle _gridViewItemStyle;
 
 		~StructuredItemsViewHandler() => _layoutPropertyChangedProxy?.Unsubscribe();
 
@@ -82,6 +86,9 @@ public static void MapItemSizingStrategy(StructuredItemsViewHandler<TItemsView>
 
 		protected override ListViewBase SelectListViewBase()
 		{
+			_listViewItemStyle = GetDefaultStyle(ListViewItemStyleKey);
+			_gridViewItemStyle = GetDefaultStyle(GridViewItemStyleKey);
+
 			switch (VirtualView.ItemsLayout)
 			{
 				case GridItemsLayout gridItemsLayout:
@@ -245,20 +252,35 @@ static WStyle GetItemContainerStyle(GridItemsLayout layout)
 
 			var style = new WStyle(typeof(GridViewItem));
 
+			if (_gridViewItemStyle is not null)
+			{
+				style.BasedOn = _gridViewItemStyle;
+			}
+
 			style.Setters.Add(new WSetter(FrameworkElement.MarginProperty, margin));
 			style.Setters.Add(new WSetter(Control.PaddingProperty, WinUIHelpers.CreateThickness(0)));
 			style.Setters.Add(new WSetter(Control.HorizontalContentAlignmentProperty, HorizontalAlignment.Stretch));
 
 			return style;
 		}
 
+		static WStyle GetDefaultStyle(string resourceKey)
+		{
+			return Microsoft.UI.Xaml.Application.Current.Resources[resourceKey] as WStyle;
+		}
+
 		static WStyle GetVerticalItemContainerStyle(LinearItemsLayout layout)
 		{
 			var v = layout?.ItemSpacing ?? 0;
 			var margin = WinUIHelpers.CreateThickness(0, v, 0, v);
 
 			var style = new WStyle(typeof(ListViewItem));
 
+			if (_listViewItemStyle is not null)
+			{
+				style.BasedOn = _listViewItemStyle;
+			}
+
 			style.Setters.Add(new WSetter(FrameworkElement.MinHeightProperty, 0));
 			style.Setters.Add(new WSetter(FrameworkElement.MarginProperty, margin));
 			style.Setters.Add(new WSetter(Control.PaddingProperty, WinUIHelpers.CreateThickness(0)));
@@ -274,6 +296,11 @@ static WStyle GetHorizontalItemContainerStyle(LinearItemsLayout layout)
 
 			var style = new WStyle(typeof(ListViewItem));
 
+			if (_listViewItemStyle is not null)
+			{
+				style.BasedOn = _listViewItemStyle;
+			}
+
 			style.Setters.Add(new WSetter(FrameworkElement.MinWidthProperty, 0));
 			style.Setters.Add(new WSetter(Control.PaddingProperty, padding));
 			style.Setters.Add(new WSetter(Control.VerticalContentAlignmentProperty, VerticalAlignment.Stretch));

src/Controls/tests/TestCases.Android.Tests/snapshots/android/CollectionViewSelectionModeOnDarkTheme.png

@@ -0,0 +1,46 @@
+using System.Collections.ObjectModel;
+
+namespace Maui.Controls.Sample.Issues;
+
+[Issue(IssueTracker.Github, 30868, "CollectionView selection visual states", PlatformAffected.UWP)]
+public class Issue30868 : ContentPage
+{
+	public ObservableCollection<string> Items { get; set; }
+
+	public Issue30868()
+	{
+		Items = new ObservableCollection<string>
+		{
+			"Item 1",
+			"Item 2",
+			"Item 3"
+		};
+
+		var collectionView = new CollectionView
+		{
+			ItemsSource = Items,
+			SelectionMode = SelectionMode.Multiple,
+			HeightRequest = 40,
+			AutomationId = "collectionViewSelectionMode",
+			ItemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
+			{
+				ItemSpacing = 4
+			},
+			ItemTemplate = new DataTemplate(() =>
+			{
+				var label = new Label
+				{
+					FontSize = 16,
+					VerticalOptions = LayoutOptions.Center,
+					VerticalTextAlignment = TextAlignment.Center,
+					Padding = new Thickness(10, 0, 10, 10),
+					TextColor = Colors.Purple
+				};
+				label.SetBinding(Label.TextProperty, ".");
+				return label;
+			})
+		};
+
+		Content = collectionView;
+	}
+}

src/Controls/tests/TestCases.Android.Tests/snapshots/android/CollectionViewSelectionModeOnLightTheme.png

@@ -0,0 +1,43 @@
+using NUnit.Framework;
+using UITest.Appium;
+using UITest.Core;
+
+namespace Microsoft.Maui.TestCases.Tests.Issues;
+
+public class Issue30868 : _IssuesUITest
+{
+	public Issue30868(TestDevice testDevice) : base(testDevice)
+	{
+	}
+	public override string Issue => "CollectionView selection visual states";
+
+#if TEST_FAILS_ON_WINDOWS // Using AppThemeBinding and changing theme not working on Windows
+	[Test, Order(1)]
+	[Category(UITestCategories.CollectionView)]
+	public void CollectionViewSelectionModeOnDarkTheme()
+	{
+		try
+		{
+			App.SetDarkTheme();
+			App.WaitForElement("Item 2");
+			App.Tap("Item 2");
+			VerifyScreenshot();
+		}
+		finally
+		{
+			App.SetLightTheme();
+		}
+	}
+#endif
+
+	[Test, Order(2)]
+	[Category(UITestCategories.CollectionView)]
+	public void CollectionViewSelectionModeOnLightTheme()
+	{
+		App.WaitForElement("Item 2");
+#if WINDOWS
+		App.Tap("Item 2");
+#endif
+		VerifyScreenshot();
+	}
+}