Implement CharacterSpacing property in TimePickerHandlers (#555)

src/Compatibility/Core/src/Android/Renderers/TimePickerRenderer.cs

@@ -178,6 +178,7 @@ namespace Microsoft.Maui.Controls.Compatibility.Platform.Android
 			EditText.SetTextSize(ComplexUnitType.Sp, (float)Element.FontSize);
 		}
 
+		[PortHandler]
 		void UpdateCharacterSpacing()
 		{
 			if (Forms.IsLollipopOrNewer)

src/Compatibility/Core/src/iOS/Renderers/TimePickerRenderer.cs

@@ -194,6 +194,7 @@ namespace Microsoft.Maui.Controls.Compatibility.Platform.iOS
 			Control.Text = Control.Text;
 		}
 
+		[PortHandler]
 		void UpdateCharacterSpacing()
 		{
 			var textAttr = Control.AttributedText.AddCharacterSpacing(Control.Text, Element.CharacterSpacing);

src/Controls/samples/Controls.Sample/Pages/MainPage.cs

@@ -144,6 +144,7 @@ namespace Maui.Controls.Sample.Pages
 			verticalStack.Add(new DatePicker());
 
 			verticalStack.Add(new TimePicker());
+			verticalStack.Add(new TimePicker { Time = TimeSpan.FromHours(8), CharacterSpacing = 6 });
 
 			verticalStack.Add(new Image() { Source = "dotnet_bot.png" });
 

src/Core/src/Core/IText.cs

@@ -21,7 +21,7 @@ namespace Microsoft.Maui
 		Font Font { get; }
 
 		/// <summary>
-		/// Gets the character spacing.
+		/// Gets the spacing between characters of the text.
 		/// </summary>
 		double CharacterSpacing { get; }
 	}

src/Core/src/Core/ITimePicker.cs

@@ -2,9 +2,24 @@
 
 namespace Microsoft.Maui
 {
+	/// <summary>
+	/// Represents a View that allows the user to select a time.
+	/// </summary>
 	public interface ITimePicker : IView
 	{
+		/// <summary>
+		/// The format of the time to display to the user.
+		/// </summary>
 		string Format { get; }
+
+		/// <summary>
+		/// Gets the displayed time.
+		/// </summary>
 		TimeSpan Time { get; set; }
+
+		/// <summary>
+		/// Gets the spacing between characters of the text.
+		/// </summary>
+		double CharacterSpacing { get; }
 	}
 }

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

@@ -54,6 +54,11 @@ namespace Microsoft.Maui.Handlers
 			handler.TypedNativeView?.UpdateTime(timePicker);
 		}
 
+		public static void MapCharacterSpacing(TimePickerHandler handler, ITimePicker timePicker)
+		{
+			handler.TypedNativeView?.UpdateCharacterSpacing(timePicker);
+		}
+
 		void ShowPickerDialog()
 		{
 			if (VirtualView == null)

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

@@ -8,5 +8,6 @@ namespace Microsoft.Maui.Handlers
 
 		public static void MapFormat(TimePickerHandler handler, ITimePicker view) { }
 		public static void MapTime(TimePickerHandler handler, ITimePicker view) { }
+		public static void MapCharacterSpacing(TimePickerHandler handler, ITimePicker view) { }
 	}
 }

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

@@ -5,7 +5,8 @@
 		public static PropertyMapper<ITimePicker, TimePickerHandler> TimePickerMapper = new PropertyMapper<ITimePicker, TimePickerHandler>(ViewHandler.ViewMapper)
 		{
 			[nameof(ITimePicker.Format)] = MapFormat,
-			[nameof(ITimePicker.Time)] = MapTime
+			[nameof(ITimePicker.Time)] = MapTime,
+			[nameof(ITimePicker.CharacterSpacing)] = MapCharacterSpacing
 		};
 
 		public TimePickerHandler() : base(TimePickerMapper)

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

@@ -39,6 +39,11 @@ namespace Microsoft.Maui.Handlers
 			handler.TypedNativeView?.UpdateTime(timePicker);
 		}
 
+		public static void MapCharacterSpacing(TimePickerHandler handler, ITimePicker timePicker)
+		{
+			handler.TypedNativeView?.UpdateCharacterSpacing(timePicker);
+		}
+
 		void OnValueChanged(object? sender, EventArgs e)
 		{
 			SetVirtualViewTime();

src/Core/src/Platform/Android/TimePickerExtensions.cs

@@ -2,14 +2,19 @@
 {
 	public static class TimePickerExtensions
 	{
-		public static void UpdateFormat(this MauiTimePicker mauiTimePicker, ITimePicker view)
+		public static void UpdateFormat(this MauiTimePicker mauiTimePicker, ITimePicker timePicker)
 		{
-			mauiTimePicker.SetTime(view);
+			mauiTimePicker.SetTime(timePicker);
 		}
 
-		public static void UpdateTime(this MauiTimePicker mauiTimePicker, ITimePicker view)
+		public static void UpdateTime(this MauiTimePicker mauiTimePicker, ITimePicker timePicker)
 		{
-			mauiTimePicker.SetTime(view);
+			mauiTimePicker.SetTime(timePicker);
+		}
+
+		public static void UpdateCharacterSpacing(this MauiTimePicker mauiTimePicker, ITimePicker timePicker)
+		{
+			mauiTimePicker.LetterSpacing = timePicker.CharacterSpacing.ToEm();
 		}
 
 		internal static void SetTime(this MauiTimePicker mauiTimePicker, ITimePicker timePicker)

src/Core/src/Platform/iOS/TimePickerExtensions.cs

@@ -1,6 +1,5 @@
 using System;
 using System.Globalization;
-using System.Linq;
 using Foundation;
 using UIKit;
 
@@ -8,22 +7,22 @@ namespace Microsoft.Maui
 {
 	public static class TimePickerExtensions
 	{
-		public static void UpdateFormat(this MauiTimePicker nativeView, ITimePicker view)
+		public static void UpdateFormat(this MauiTimePicker mauiTimePicker, ITimePicker view)
 		{
-			nativeView.UpdateTime(view, null);
+			mauiTimePicker.UpdateTime(view, null);
 		}
 
-		public static void UpdateFormat(this MauiTimePicker nativeView, ITimePicker view, UIDatePicker? picker)
+		public static void UpdateFormat(this MauiTimePicker mauiTimePicker, ITimePicker view, UIDatePicker? picker)
 		{
-			nativeView.UpdateTime(view, picker);
+			mauiTimePicker.UpdateTime(view, picker);
 		}
 
-		public static void UpdateTime(this MauiTimePicker nativeView, ITimePicker view)
+		public static void UpdateTime(this MauiTimePicker mauiTimePicker, ITimePicker view)
 		{
-			nativeView.UpdateTime(view, null);
+			mauiTimePicker.UpdateTime(view, null);
 		}
 
-		public static void UpdateTime(this MauiTimePicker nativeTimePicker, ITimePicker timePicker, UIDatePicker? picker)
+		public static void UpdateTime(this MauiTimePicker mauiTimePicker, ITimePicker timePicker, UIDatePicker? picker)
 		{
 			if (picker != null)
 				picker.Date = new DateTime(1, 1, 1).Add(timePicker.Time).ToNSDate();
@@ -41,7 +40,7 @@ namespace Microsoft.Maui
 			var time = timePicker.Time;
 			var format = timePicker.Format;
 
-			nativeTimePicker.Text = time.ToFormattedString(format, cultureInfo);
+			mauiTimePicker.Text = time.ToFormattedString(format, cultureInfo);
 
 			if (timePicker.Format?.Contains('H') == true)
 			{
@@ -59,6 +58,16 @@ namespace Microsoft.Maui
 				if (picker != null)
 					picker.Locale = locale;
 			}
+
+			mauiTimePicker.UpdateCharacterSpacing(timePicker);
+		}
+
+		public static void UpdateCharacterSpacing(this MauiTimePicker mauiTimePicker, ITimePicker view)
+		{
+			var textAttr = mauiTimePicker.AttributedText?.WithCharacterSpacing(view.CharacterSpacing);
+
+			if (textAttr != null)
+				mauiTimePicker.AttributedText = textAttr;
 		}
 	}
 }

src/Core/tests/DeviceTests/Handlers/TimePicker/TimePickerHandlerTests.Android.cs

@@ -1,13 +1,40 @@
 using System;
 using System.Threading.Tasks;
+using Microsoft.Maui.DeviceTests.Stubs;
 using Microsoft.Maui.Handlers;
 using Xunit;
 
 namespace Microsoft.Maui.DeviceTests
 {
 	public partial class TimePickerHandlerTests
-	{
-		MauiTimePicker GetNativeTimePicker(TimePickerHandler timePickerHandler) =>
+    {
+        [Fact(DisplayName = "CharacterSpacing Initializes Correctly")]
+        public async Task CharacterSpacingInitializesCorrectly()
+        {
+            var xplatCharacterSpacing = 4;
+
+            var timePicker = new TimePickerStub()
+            {
+                CharacterSpacing = xplatCharacterSpacing,
+                Time = TimeSpan.FromHours(8)
+            };
+
+            float expectedValue = timePicker.CharacterSpacing.ToEm();
+
+            var values = await GetValueAsync(timePicker, (handler) =>
+            {
+                return new
+                {
+                    ViewValue = timePicker.CharacterSpacing,
+                    NativeViewValue = GetNativeCharacterSpacing(handler)
+                };
+            });
+
+            Assert.Equal(xplatCharacterSpacing, values.ViewValue);
+            Assert.Equal(expectedValue, values.NativeViewValue, EmCoefficientPrecision);
+        }
+
+        MauiTimePicker GetNativeTimePicker(TimePickerHandler timePickerHandler) =>
 			(MauiTimePicker)timePickerHandler.View;
 
 		async Task ValidateTime(ITimePicker timePickerStub, Action action = null)
@@ -22,6 +49,18 @@ namespace Microsoft.Maui.DeviceTests
 			var expected = timePickerStub.ToFormattedString();
 
 			Assert.Equal(actual, expected);
-		}
-	}
+        }
+
+        double GetNativeCharacterSpacing(TimePickerHandler timePickerHandler)
+        {
+            var mauiTimePicker = GetNativeTimePicker(timePickerHandler);
+
+            if (mauiTimePicker != null)
+            {
+                return mauiTimePicker.LetterSpacing;
+            }
+
+            return -1;
+        }
+    }
 }

src/Core/tests/DeviceTests/Handlers/TimePicker/TimePickerHandlerTests.iOS.cs

@@ -1,5 +1,6 @@
 using System;
 using System.Threading.Tasks;
+using Microsoft.Maui.DeviceTests.Stubs;
 using Microsoft.Maui.Handlers;
 using Xunit;
 
@@ -7,7 +8,31 @@ namespace Microsoft.Maui.DeviceTests
 {
 	public partial class TimePickerHandlerTests
 	{
-		MauiTimePicker GetNativeTimePicker(TimePickerHandler timePickerHandler) =>
+        [Fact(DisplayName = "CharacterSpacing Initializes Correctly")]
+        public async Task CharacterSpacingInitializesCorrectly()
+        {
+            var xplatCharacterSpacing = 4;
+
+            var timePicker = new TimePickerStub()
+            {
+                CharacterSpacing = xplatCharacterSpacing,
+                Time = TimeSpan.FromHours(8)
+            };
+
+            var values = await GetValueAsync(timePicker, (handler) =>
+            {
+                return new
+                {
+                    ViewValue = timePicker.CharacterSpacing,
+                    NativeViewValue = GetNativeCharacterSpacing(handler)
+                };
+            });
+
+            Assert.Equal(xplatCharacterSpacing, values.ViewValue);
+            Assert.Equal(xplatCharacterSpacing, values.NativeViewValue);
+        }
+
+        MauiTimePicker GetNativeTimePicker(TimePickerHandler timePickerHandler) =>
 			(MauiTimePicker)timePickerHandler.View;
 
 		async Task ValidateTime(ITimePicker timePickerStub, Action action = null)
@@ -23,6 +48,12 @@ namespace Microsoft.Maui.DeviceTests
 			var expected = timePickerStub.ToFormattedString();
 
 			Assert.Equal(actual, expected);
-		}
-	}
+        }
+
+        double GetNativeCharacterSpacing(TimePickerHandler timePickerHandler)
+        {
+            var mauiTimePicker = GetNativeTimePicker(timePickerHandler);
+            return mauiTimePicker.AttributedText.GetCharacterSpacing();
+        }
+    }
 }

src/Core/tests/DeviceTests/Stubs/TimePickerStub.cs

@@ -13,5 +13,7 @@ namespace Microsoft.Maui.DeviceTests.Stubs
 			get => _time;
 			set => SetProperty(ref _time, value);
 		}
+
+		public double CharacterSpacing { get; set; }
 	}
 }