[Windows] Fixed TimePicker CharacterSpacing issue

eng/pipelines/ci-official.yml

@@ -104,6 +104,7 @@ extends:
             onlyAndroidPlatformDefaultApis: true
             skipAndroidEmulatorImages: true
             skipAndroidCreateAvds: true
+            skipSimulatorSetup: true
             skipProvisioning: true
             skipXcode: false
             base64Encode: true

src/Controls/tests/TestCases.HostApp/Issues/Issue30199.cs

@@ -0,0 +1,34 @@
+namespace Maui.Controls.Sample.Issues;
+
+[Issue(IssueTracker.Github, "30199", "TimePicker CharacterSpacing Property Not Working on Windows", PlatformAffected.UWP)]
+
+public class Issue30199 : ContentPage
+{
+	public Issue30199()
+	{
+		var label = new Label
+		{
+			AutomationId = "label",
+			Text = "Test passes if TimePicker has character Spacing",
+			HorizontalOptions = LayoutOptions.Center,
+			VerticalOptions = LayoutOptions.Center,
+		};
+
+		var timePicker = new TimePicker
+		{
+			AutomationId = "timePicker",
+			Time = new TimeSpan(12, 30, 0),
+			CharacterSpacing = 10,
+			HorizontalOptions = LayoutOptions.Center,
+			VerticalOptions = LayoutOptions.Center,
+			Format = "HH:mm"
+		};
+
+		Content = new StackLayout
+		{
+			Children = { label, timePicker },
+			Spacing = 20,
+			Margin = new Thickness(20)
+		};
+	}
+}

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue30199.cs

@@ -0,0 +1,25 @@
+#if TEST_FAILS_ON_CATALYST //Issue Link https://github.com/dotnet/maui/issues/30532
+using NUnit.Framework;
+using UITest.Appium;
+using UITest.Core;
+
+namespace Microsoft.Maui.TestCases.Tests.Issues;
+
+public class Issue30199 : _IssuesUITest
+{
+	public Issue30199(TestDevice device)
+		: base(device)
+	{
+	}
+
+	public override string Issue => "TimePicker CharacterSpacing Property Not Working on Windows";
+
+	[Test]
+	[Category(UITestCategories.TimePicker)]
+	public void Issue30199TimePickerCharacterSpacingShouldApply()
+	{
+		App.WaitForElement("timePicker");
+		VerifyScreenshot();
+	}
+}
+#endif

src/Core/src/Handlers/TimePicker/TimePickerHandler.Windows.cs

@@ -1,4 +1,5 @@
 using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml;
 using WBrush = Microsoft.UI.Xaml.Media.Brush;
 
 namespace Microsoft.Maui.Handlers

src/Core/src/Platform/Windows/TimePickerExtensions.cs

@@ -28,6 +28,18 @@ public static void UpdateTime(this TimePicker nativeTimePicker, ITimePicker time
 	public static void UpdateCharacterSpacing(this TimePicker platformTimePicker, ITimePicker timePicker)
 	{
 		platformTimePicker.CharacterSpacing = timePicker.CharacterSpacing.ToEm();
+		if (!platformTimePicker.IsLoaded)
+		{
+			RoutedEventHandler? onLoaded = null;
+			onLoaded = (s, e) =>
+			{
+				platformTimePicker.Loaded -= onLoaded;
+				UpdateCharacterSpacingInTimePicker(platformTimePicker);
+			};
+			platformTimePicker.Loaded += onLoaded;
+			return;
+		}
+		UpdateCharacterSpacingInTimePicker(platformTimePicker);
 	}
 
 	public static void UpdateFont(this TimePicker platformTimePicker, ITimePicker timePicker, IFontManager fontManager) =>
@@ -81,6 +93,25 @@ public static void UpdateBackground(this TimePicker platformTimePicker, ITimePic
 		platformTimePicker.RefreshThemeResources();
 	}
 
+	static readonly string[] s_timePickerTextBlockNames = { "HourTextBlock", "MinuteTextBlock", "PeriodTextBlock" };
+
+	static void UpdateCharacterSpacingInTimePicker(this TimePicker platformTimePicker)
+	{
+		foreach (var partName in s_timePickerTextBlockNames)
+		{
+			SetCharacterSpacingToBlocks(platformTimePicker, partName);
+		}
+	}
+
+	static void SetCharacterSpacingToBlocks(TimePicker platformTimePicker, string partName)
+	{
+		var textBlock = platformTimePicker.GetDescendantByName<TextBlock>(partName);
+		if (textBlock is not null)
+		{
+			textBlock.CharacterSpacing = platformTimePicker.CharacterSpacing;
+		}
+	}
+
 	static readonly string[] BackgroundColorResourceKeys =
 	{
 		"TimePickerButtonBackground",