How to customize the overlay background in .NET MAUI Popup (SfPopup)?

The .NET MAUI Popup control offers way to customize is the overlay background. This article will guide you through the process of removing the overlay or changing its color.

Removing the Overlay

To remove the overlay background, set the ShowOverlayAlways property to False . By default, this property is set to True, making the overlay visible whenever the popup is active.

XAML

<sfpopup:SfPopup x:Name="popup" ShowOverlayAlways="False">

With this setting, the popup will appear without the dimmed overlay background.

Output

Changing Overlay Color

To change the overlay color, use the OverlayColor property within PopupStyle.

XAML

<sfpopup:SfPopup x:Name="popup">
    <sfpopup:SfPopup.PopupStyle>
        <sfpopup:PopupStyle OverlayColor="LightPink">
        </sfpopup:PopupStyle>
    </sfpopup:SfPopup.PopupStyle>
</sfpopup:SfPopup>

This changes the overlay background to light pink when the popup is displayed.

Output

Download the complete sample on GitHub

Conclusion
I hope you enjoyed learning how to customize overlay background in .NET MAUI Popup.
You can refer to our .NET MAUI Popup feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion®, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!