diff --git a/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml b/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml new file mode 100644 index 000000000000..9967152c8218 --- /dev/null +++ b/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml @@ -0,0 +1,175 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml.cs b/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml.cs new file mode 100644 index 000000000000..33d711f353e4 --- /dev/null +++ b/src/Controls/samples/Controls.Sample.UITests/Issues/BorderWithDifferentShapes.xaml.cs @@ -0,0 +1,17 @@ +using Microsoft.Maui.Controls; +using Microsoft.Maui.Controls.Xaml; +using Microsoft.Maui.Platform; + +namespace Maui.Controls.Sample.Issues +{ + [XamlCompilation(XamlCompilationOptions.Compile)] + [Issue(IssueTracker.None, 018071, "Validate Border using different shapes", + PlatformAffected.Android | PlatformAffected.iOS | PlatformAffected.UWP)] + public partial class BorderWithDifferentShapes : ContentPage + { + public BorderWithDifferentShapes() + { + InitializeComponent(); + } + } +} \ No newline at end of file diff --git a/src/Controls/samples/Controls.Sample.UITests/Issues/Issue18071.cs b/src/Controls/samples/Controls.Sample.UITests/Issues/Issue18071.cs new file mode 100644 index 000000000000..6587ca06b49a --- /dev/null +++ b/src/Controls/samples/Controls.Sample.UITests/Issues/Issue18071.cs @@ -0,0 +1,56 @@ +using Microsoft.Maui; +using Microsoft.Maui.Controls; +using Microsoft.Maui.Graphics; +using Microsoft.Maui.Controls.Shapes; + +namespace Maui.Controls.Sample.Issues +{ + [Issue(IssueTracker.Github, 18071, "Windows and Android no longer draw Borders/clipping correctly", PlatformAffected.Android | PlatformAffected.UWP)] + public class Issue18071 : TestContentPage + { + protected override void Init() + { + Title = "Issue 18071"; + BackgroundColor = Colors.CornflowerBlue; + + VerticalStackLayout verticalLayout = new VerticalStackLayout(); + Content = verticalLayout; + + var infoLabel = new Label + { + AutomationId = "WaitForStubControl", + Text = "Without weird clipping image, the test has passed." + }; + verticalLayout.Add(infoLabel); + + Border border = new Border + { + Background = Colors.Yellow, + Stroke = Colors.Red, + StrokeThickness = 10 + }; + verticalLayout.Add(border); + + AbsoluteLayout abs = new AbsoluteLayout(); + border.Content = abs; + + Image image = new Image + { + Source = "oasis.jpg", + Aspect = Aspect.AspectFill + }; + abs.Add(image); + + SizeChanged += delegate + { + if (Width > 0) + { + int width = (int)Width; + border.WidthRequest = border.HeightRequest = width * 0.5; + image.WidthRequest = image.HeightRequest = width * 0.5; + border.StrokeShape = new RoundRectangle() { CornerRadius = width * 0.25 }; + } + }; + } + } +} diff --git a/src/Controls/samples/Controls.Sample.UITests/Resources/Images/oasis.jpg b/src/Controls/samples/Controls.Sample.UITests/Resources/Images/oasis.jpg new file mode 100644 index 000000000000..e0be19c886ff Binary files /dev/null and b/src/Controls/samples/Controls.Sample.UITests/Resources/Images/oasis.jpg differ diff --git a/src/Controls/tests/UITests/Tests/Issues/BorderWithDifferentShapes.cs b/src/Controls/tests/UITests/Tests/Issues/BorderWithDifferentShapes.cs new file mode 100644 index 000000000000..22785f54e8ef --- /dev/null +++ b/src/Controls/tests/UITests/Tests/Issues/BorderWithDifferentShapes.cs @@ -0,0 +1,22 @@ +using NUnit.Framework; +using UITest.Appium; +using UITest.Core; + +namespace Microsoft.Maui.AppiumTests.Issues +{ + class BorderWithDifferentShapes : _IssuesUITest + { + public BorderWithDifferentShapes(TestDevice device) + : base(device) + { } + + public override string Issue => "Validate Border using different shapes"; + + [Test] + public void BorderWithDifferentShapesTest() + { + App.WaitForElement("WaitForStubControl"); + VerifyScreenshot(); + } + } +} diff --git a/src/Controls/tests/UITests/Tests/Issues/Issue18071.cs b/src/Controls/tests/UITests/Tests/Issues/Issue18071.cs new file mode 100644 index 000000000000..2c07ae364b2e --- /dev/null +++ b/src/Controls/tests/UITests/Tests/Issues/Issue18071.cs @@ -0,0 +1,23 @@ +using NUnit.Framework; +using UITest.Appium; +using UITest.Core; + +namespace Microsoft.Maui.AppiumTests.Issues +{ + public class Issue18071 : _IssuesUITest + { + public Issue18071(TestDevice device) : base(device) { } + + public override string Issue => "Windows and Android no longer draw Borders/clipping correctly"; + + [Test] + public void Issue18071Test() + { + this.IgnoreIfPlatforms(new TestDevice[] { TestDevice.iOS }, + "Currently fails on Android and Windows; see https://github.com/dotnet/maui/issues/17125"); + + App.WaitForElement("WaitForStubControl"); + VerifyScreenshot(); + } + } +} diff --git a/src/Controls/tests/UITests/snapshots/android/BorderWithDifferentShapesTest.png b/src/Controls/tests/UITests/snapshots/android/BorderWithDifferentShapesTest.png new file mode 100644 index 000000000000..86a1196ac994 Binary files /dev/null and b/src/Controls/tests/UITests/snapshots/android/BorderWithDifferentShapesTest.png differ diff --git a/src/Controls/tests/UITests/snapshots/android/Issue18071Test.png b/src/Controls/tests/UITests/snapshots/android/Issue18071Test.png new file mode 100644 index 000000000000..536710722f89 Binary files /dev/null and b/src/Controls/tests/UITests/snapshots/android/Issue18071Test.png differ diff --git a/src/Controls/tests/UITests/snapshots/ios/BorderWithDifferentShapesTest.png b/src/Controls/tests/UITests/snapshots/ios/BorderWithDifferentShapesTest.png new file mode 100644 index 000000000000..1d2c16419d09 Binary files /dev/null and b/src/Controls/tests/UITests/snapshots/ios/BorderWithDifferentShapesTest.png differ diff --git a/src/Controls/tests/UITests/snapshots/windows/BorderWithDifferentShapesTest.png b/src/Controls/tests/UITests/snapshots/windows/BorderWithDifferentShapesTest.png new file mode 100644 index 000000000000..2239e634fce9 Binary files /dev/null and b/src/Controls/tests/UITests/snapshots/windows/BorderWithDifferentShapesTest.png differ diff --git a/src/Controls/tests/UITests/snapshots/windows/Issue18071Test.png b/src/Controls/tests/UITests/snapshots/windows/Issue18071Test.png new file mode 100644 index 000000000000..82e10419d185 Binary files /dev/null and b/src/Controls/tests/UITests/snapshots/windows/Issue18071Test.png differ diff --git a/src/Core/src/Platform/Android/ContentViewGroup.cs b/src/Core/src/Platform/Android/ContentViewGroup.cs index a7d1194d1058..00af1c8303d0 100644 --- a/src/Core/src/Platform/Android/ContentViewGroup.cs +++ b/src/Core/src/Platform/Android/ContentViewGroup.cs @@ -115,13 +115,14 @@ internal IBorderStroke? Clip if (Clip is null || Clip?.Shape is null) return null; + IShape clipShape = Clip.Shape; + bool isRoundRectangle = clipShape is IRoundRectangle; float density = _context.GetDisplayDensity(); float strokeThickness = (float)Clip.StrokeThickness; - float w = (width / density) - strokeThickness; - float h = (height / density) - strokeThickness; - float x = strokeThickness / 2; - float y = strokeThickness / 2; - IShape clipShape = Clip.Shape; + float w = (width / density) - (isRoundRectangle ? (strokeThickness * 2) : strokeThickness); + float h = (height / density) - (isRoundRectangle ? (strokeThickness * 2) : strokeThickness); + float x = isRoundRectangle ? strokeThickness : strokeThickness / 2; + float y = isRoundRectangle ? strokeThickness : strokeThickness / 2; var bounds = new Graphics.RectF(x, y, w, h);