search

xamarin / Xamarin.Forms

Xamarin.Forms is no longer supported. Migrate your apps to .NET MAUI.
https://aka.ms/xamarin-upgrade
Other
5.62k stars 1.87k forks source link

[Bug] Custom Gradient Renderer blows Canvas size on Android #7104

Open claitonlovato opened 5 years ago

claitonlovato commented 5 years ago

Description

Creating a custom Frame Renderer to display a Gradient as the background, the gradient expands past the Canvas size on Android using Xamarin.Forms version 4.0.0.540366 or above.

I am using a custom renderer to create Frames with gradient backgrounds, (following examples found elsewhere). The custom renderer works fine if using the Xamaring.Forms version 4.0.0.497661 or older, but upgrading the package to version 4.0.0.540366 or newer, the gradient background expands past the size of the Frame and over other elements on screen.

I had the same problem with version 4.0.0.497661 and I managed to fix the problem by surrounding my custom renderer with a Frame element, which would constrain the background size of the Canvas to the parent Frame, but even this "fix" is not working anymore on newer versions of the package.

For Android testing I am using a Google Pixel 2 running API 28. Some tests on the Android Emulator does NOT reproduce the error.

Steps to Reproduce

The followings steps illustrates how to reproduce using the attached sample code. The sample code should be using the version 4.0.0.540366, so the first execution of the application on Android should show the page working as expected, upgrading the package to version 4.0.0.540366 will show the problem on rendering.

  1. Create a new Renderer for the Shared Library with platform specific implementations on both iOS and Android
  2. Add a new GradientFrame to XAML with elements inside. Set the required colours for the gradient.
  3. Change Nuget package of Xamaring.Forms between 4.0.0.497661 and 4.0.0.540366

Expected Behavior

The Title would have a Gradient background; The Sub-Title frame would have a Gradient background;

Actual Behavior

The Sub-Title Gradient Frame background expands past the containing border and is displayed over other elements on the page

Basic Information

Screenshots

Reproduction Link

Xamarin.Forms - Gradient Renderer.zip

claitonlovato commented 5 years ago

I failed to added a note saying I also tested if this was related to #5926 but adding the flag UseLegacyRenderers did not change the behaviour

jfversluis commented 5 years ago

Hey @claitonlovato, thanks for this great report!

I do indeed see some funky stuff going on here. If you find anything else in this regard, please let us know.

SandraHicks commented 4 years ago

Is there anything new about this Bug? I still have this issue in Xamarin.Forms Version 4.3.0.991211. Or is there any fix available?

claitonlovato commented 4 years ago

Hi @SandraHicks Looks like this bug is still there, no movement since the 15th August :( In any case I found another workaround that is working for me: You can wrap the gradient control with a and set its "IsClippedToBounds" to True. In my view this is not a solution as the gradient layer is still generated over the bounds of the canvas, but when rendered the frame will clip it and the gradient should stay inside the parent frame bounds. I normaly set the parent frame with 0 Padding and Margin so its basically the same size as the gradient. Hope this helps you until there is a fix for this bug.

Kind regards, Claiton Lovato

SandraHicks commented 4 years ago

@claitonlovato This fix worked for me, thank you very much!