the49ltd / The49.Maui.BottomSheet

.NET MAUI library used to display pages as Bottom Sheets
MIT License
330 stars 32 forks source link

[Android] Corner radius disappear when fully extended #14

Closed DiogoDeAlmeida closed 1 year ago

DiogoDeAlmeida commented 1 year ago

Hi !

First of all, I want to thank you for this package, it works perfectly! I have just one question about the corner radius of the bottom sheet. As you can see in my video, when the bottom sheet is fully extended, the corner radius disappears. Is this intentional? Can I remove it? Or is this specific to my Android version only?

https://user-images.githubusercontent.com/67577360/233959606-2379b9fd-66c4-4f62-a2a2-050ce8faf599.mp4

paulvarache commented 1 year ago

Hi,

Thanks for the support!

This is the default Android behaviour. When the sheet reaches its maximum configured height, the default material design style transitions from rounded to rounded corners to indicate the sheets cannot be expanded further.

You have 2 options:

  1. Add a Fullscreen detent, allowing user to slide the sheet all the way up. This will make the detent shown in your video have a corner radius. But this will also let users slide the sheet up, which might not be a behaviour you want
  2. Configure the Android behaviour to disable the corner animation. Unfortunately this is not wired to a property within this plugin (yet 😉). But there is a (not so great) workaround:

Right after the call to .Show(Window);, add this:

#if ANDROID
        await Task.Delay(100);
        page.Controller.Behavior.DisableShapeAnimations();
#endif

I'll keep this issue in mind when it comes to adding more Android and iOS specific customisations for future versions

paulvarache commented 1 year ago

Hi,

I have just published a new version of this plugin. There is now a better way to handle this issue. I have added a section in the README dedicated to removing the corner animation from the Android Bottom Sheets: https://github.com/the49code/The49.Maui.BottomSheet#how-do-i-prevent-the-rounded-corner-to-animate-on-android

DiogoDeAlmeida commented 1 year ago

Thanks for your reactivity! It works perfectly with your first workaround (well, as you said, not so great, but it works at least). And I got the corner radius even when it's fully expanded.

Then I updated your package to Alpha-5, but it seems we have lost 2 properties (IsModal & ShowHandle).

Alpha-5 update without changing anything:

https://user-images.githubusercontent.com/67577360/234006303-8c03cd1e-c583-4bd9-8ec9-c8a6a0748a79.mp4

DiogoDeAlmeida commented 1 year ago

Never mind, I just read the rest of the Readme, and everything is explained!

Sorry for the spaming but weird thing, my text (from button and label) are not centered anymore since alpha-5. (You can see it in the video upper).