Added a support for GradientBrushes on Shape.Stroke (#21983)

Author: kubaflo

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

@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="Maui.Controls.Sample.Issues.Issue21983"
+             Title="Issue21983">
+
+    <ContentPage.Resources>
+        <ResourceDictionary>
+            <LinearGradientBrush x:Key="LinearGradient">
+                <LinearGradientBrush.GradientStops>
+                    <GradientStop Offset="0" Color="Red" />
+                    <GradientStop Offset="0.5" Color="Blue" />
+                    <GradientStop Offset="0.9" Color="Purple" />
+                </LinearGradientBrush.GradientStops>
+            </LinearGradientBrush>
+
+            <RadialGradientBrush x:Key="RadialGradient">
+                <RadialGradientBrush.GradientStops>
+                    <GradientStop Offset="0" Color="Red" />
+                    <GradientStop Offset="0.5" Color="Blue" />
+                    <GradientStop Offset="0.9" Color="Purple" />
+                </RadialGradientBrush.GradientStops>
+            </RadialGradientBrush>
+        </ResourceDictionary>
+    </ContentPage.Resources>
+
+    <VerticalStackLayout Margin="30,0" Spacing="35">
+        <Path
+            AutomationId="path"
+            Fill="Red"
+            Stroke="{StaticResource LinearGradient}"
+            StrokeThickness="20">
+            <Path.Data>
+                <PathGeometry>
+                    <PathFigureCollection>
+                        <PathFigure StartPoint="0,0">
+                            <ArcSegment
+                                IsLargeArc="False"
+                                Point="120,140"
+                                Size="100,100"
+                                SweepDirection="Clockwise" />
+                        </PathFigure>
+                    </PathFigureCollection>
+                </PathGeometry>
+            </Path.Data>
+        </Path>
+
+        <Ellipse
+            Fill="Red"
+            HeightRequest="50"
+            Stroke="{StaticResource RadialGradient}"
+            StrokeThickness="10"
+            WidthRequest="50" />
+
+        <Ellipse
+            Fill="{StaticResource RadialGradient}"
+            HeightRequest="50"
+            Stroke="Red"
+            StrokeThickness="10"
+            WidthRequest="50" />
+    </VerticalStackLayout>
+</ContentPage>

src/Controls/tests/TestCases.HostApp/Issues/Issue21983.xaml

@@ -0,0 +1,15 @@
+using Microsoft.Maui.Controls;
+using Microsoft.Maui.Controls.Xaml;
+
+namespace Maui.Controls.Sample.Issues;
+
+[XamlCompilation(XamlCompilationOptions.Compile)]
+[Issue(IssueTracker.Github, 21983, "GradientBrushes are not supported on Shape.Stroke", PlatformAffected.All)]
+
+public partial class Issue21983 : ContentPage
+{
+	public Issue21983()
+	{
+		InitializeComponent();
+	}
+}

src/Controls/tests/TestCases.HostApp/Issues/Issue21983.xaml.cs

@@ -0,0 +1,26 @@
+#if !WINDOWS
+using NUnit.Framework;
+using UITest.Appium;
+using UITest.Core;
+
+namespace Microsoft.Maui.AppiumTests.Issues
+{
+	public class Issue21983 : _IssuesUITest
+	{
+		public override string Issue => "GradientBrushes are not supported on Shape.Stroke";
+
+		public Issue21983(TestDevice device) : base(device)
+		{
+		}
+
+		[Test]
+		[Category(UITestCategories.Shape)]
+		public void GradientShouldBeAppliedToStrokes()
+		{
+			_ = App.WaitForElement("path");
+
+			VerifyScreenshot();
+		}
+	}
+}
+#endif

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

@@ -84,8 +84,7 @@ void DrawStrokePath(ICanvas canvas, RectF dirtyRect, PathF path)
 			// Set Stroke
 			var stroke = ShapeView.Stroke;
 
-			// TODO: Add Paint support for Stroke in Microsoft.Maui.Graphics.
-			// For now, only support a solid color.
+			// TODO: Add Paint support for Stroke in Microsoft.Maui.Graphics for Windows
 			canvas.StrokeColor = stroke.ToColor();
 
 			// Set StrokeLineCap
@@ -108,6 +107,7 @@ void DrawStrokePath(ICanvas canvas, RectF dirtyRect, PathF path)
 			var strokeMiterLimit = ShapeView.StrokeMiterLimit;
 			canvas.MiterLimit = strokeMiterLimit;
 
+			canvas.SetFillPaint(stroke, dirtyRect);
 			canvas.DrawPath(path);
 
 			canvas.RestoreState();

src/Controls/tests/TestCases.iOS.Tests/snapshots/ios/GradientShouldBeAppliedToStrokes.png

@@ -547,6 +547,10 @@ public override void SubtractFromClip(float x, float y, float width, float heigh
 		protected override void PlatformDrawPath(PathF aPath)
 		{
 			var platformPath = aPath.AsAndroidPath();
+			if (_shader != null)
+			{
+				CurrentState.StrokePaintWithAlpha.SetShader(_shader);
+			}
 			_canvas.DrawPath(platformPath, CurrentState.StrokePaintWithAlpha);
 			platformPath.Dispose();
 		}

src/Core/src/Graphics/ShapeDrawable.cs

@@ -884,8 +884,21 @@ private CGPath GetPlatformPath(PathF path)
 		protected override void PlatformDrawPath(PathF path)
 		{
 			var platformPath = GetPlatformPath(path);
-			_context.AddPath(platformPath);
-			_context.DrawPath(CGPathDrawingMode.Stroke);
+
+			if (_gradient != null)
+			{
+				FillWithGradient(() =>
+				{
+					_context.AddPath(platformPath);
+					_context.ReplacePathWithStrokedPath();
+					return true;
+				});
+			}
+			else
+			{
+				_context.AddPath(platformPath);
+				_context.DrawPath(CGPathDrawingMode.Stroke);
+			}
 		}
 
 		public override void ClipPath(PathF path, WindingMode windingMode = WindingMode.NonZero)