How to achieve a modal similar to Bootstrap modal in .NET MAUI?

How can I achieve a Bootstrap modal dialog on .NET MAUI? Where..

Backdrop fade in or out
Modal content slide up or down
Modal can be close by clicking backdrop or by clicking custom close button

I've tried to find some existing libraries but have not been able to get the same effect.

Desired modal link: https://www.awesomescreenshot.com/video/11412401?key=4805d42e3e44dbabb15ff52cc2d70369

Solution

You could use the BottomSheet control for this,

More information here: https://blogs.xgenoapps.com/post/2022/07/23/maui-bottom-sheet

Add the namespace:

xmlns:controls="clr-namespace:XGENO.Maui.Controls;assembly=Maui.Controls.BottomSheet"

And then all you have to do is something like:

<controls:BottomSheet
x:Name="simpleBottomSheet"
HeaderText="Simple Example">

    <controls:BottomSheet.BottomSheetContent> 
        <Label
            Text="Hello from Bottom Sheet. This is a simple implementation with no customization." />
    </controls:BottomSheet.BottomSheetContent>
    
</controls:BottomSheet>

Also, the GitHub is here : https://github.com/naweed/Maui.Controls.BottomSheet

Also, I have a free set of controls (Android/iOS) you can check out if you are interested. It already has a bunch of controls and I am planning to add more: https://github.com/FreakyAli/MAUI.FreakyControls