Bottom Sheet

[codeanees]

Recently I came across this blog and I love to port or include this feature in Maui toolkit
https://xamarinhowto.com/xamarin-forms-lightweight-bottom-sheet-modal/

[TheCodeTraveler]

Neat! We recently added Snackbar and are working on Popup.

I could see BottomModalSheet being added to the CommunityToolkit.Maui.Alerts namespace.

Let's put this on hold until Popup has been merged, and then see how we can leverage Popup's implementation for BottomModalSheet.

After we merge Popup, @codeanees, I'd love for you to provide an API design!

[TheCodeTraveler]

👆 @pictos Just FYI since you're working on Popup

[TheCodeTraveler]

Notes discussed in January's Standup:

• Can we add functionality so that we can "fly in" the sheet from the sides and top as well?
• Can we leverage Xamarin Community Toolkit's SideMenuView?
• Can we leverage existing code from Popup, Toast and Snackbar?

[eramrit78]

is bottomsheet added in maui alerts?. nothing any thing found in docs. bottom sheet is a most demanding feature in today apps.

[TheCodeTraveler]

It is not. Would like to propose an API design for BottomSheet?

[VladislavAntonyuk]

Possible api: #454

[jfversluis]

Maybe we should contact @naweed and see if we can leverage some of his code: https://blogs.xgenoapps.com/post/2022/07/23/maui-bottom-sheet and https://github.com/naweed/Maui.Controls.BottomSheet

[VladislavAntonyuk]

ideally, if we can reuse the popup, but it needs to support dynamic height.

[IeuanWalker]

@jfversluis This can be achieved using Rg.Popups maui replacement. But can be completely customised by the user. I only have one issue with it atm - LuckyDucko/Mopups#12

But you don't need to use a PanGestureRecognizer, it all works fine as a bottom sheet.

Another example, i used it to create my own picker - LuckyDucko/Mopups#8 (comment)

[VladislavAntonyuk]

I propose to implement it similar to SnackBar and Toast using native UISheetPopupController and BottomSheetDialog
https://vladislavantonyuk.azurewebsites.net/articles/Creating-a-bottom-sheet-using-.NET-MAUI

[durandt]

A bottom sheet would be very nice to have, it's part of many mobile applications design.

The @naweed implementation is neat but I didn't find an easy way to make the bottom sheet hide the bottom tabs when using it within a Shell with tabs.

Trouble with the UISheetPresentationController-approach is that it is only available from SDK 15 and customization from SDK 16 (and about 5% of my users are stuck on iOS 14 for whatever reason beyond my understanding since no devices were dropped by iOS 15).

I will take a bet and go forward working from the Popup implementation and try to make a Bottom Sheet implementation for our project (Android & iOS, Bottom Sheet only (no top/left/right), Three pre-defined sizes (less dynamic content stuff)) and will see if we can make something that could contribute back to the Community Toolkit.

[CliffAgius]

Closed as per the Community Stand-up discussion here: https://youtu.be/N9wMcBP4jtg?t=2889

[Cybrosys]

Could you clarify? The timestamp does not mention Bottom Sheet but instead mentions that a discussion needs 7 or more votes not to be closed, which this one has, but it was closed.

[durandt]

I was also a bit disappointed & thought it was a bit unclear but in the end I understand they need ways to triage discussions.
My understanding was that the 7-threshold was only a suggestion to change the suggested policy of 10 votes, and that the policy that was clubbed was 10votes.