How to display an element at the bottom not in the full width of the screen (Android)

Question

Answer 1

Hello,

You could refer to the following steps and sample code to open the bottom popup on Android platform.

Step 1. Create the static class that calls out the bottom popup under the Platfroms/Android file.

// Here you need to replace the namespace Android with another name, otherwise Android.Resource.Id.Content will have a namespace conflict.
namespace MauiApp91.Platforms.Droid
{
    public static class BottomPopupHelper
    {
        // These three parameters represent the page on which the method is called, the popup window to be called out, and whether or not it can be Dismissed.
        public static void ShowBottomSheet(this Page page, IView bottomSheetContent, bool dimDismiss)
        { 
            var bottomSheetDialog = new BottomSheetDialog(Platform.CurrentActivity?.Window?.DecorView.FindViewById(Android.Resource.Id.Content)?.RootView?.Context); 
            bottomSheetDialog.SetContentView(bottomSheetContent.ToPlatform(page.Handler?.MauiContext ?? throw new Exception("MauiContext is null"))); 
            bottomSheetDialog.Behavior.Hideable = dimDismiss; 
            bottomSheetDialog.Behavior.FitToContents = true; 
            bottomSheetDialog.Show(); 
        }
    }
}

Step 2. Call this static method in a Maui page, for example in a button click event.

#if ANDROID
            BottomPopupHelper.ShowBottomSheet(this, new BottomPopupPage(),true);
#endif

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.