New to Telerik UI for .NET MAUI? Start a free 30-day trial

Making SideDrawer Opacity Consistent across Platforms


Version Product Author
6.7.0 Telerik UI for .NET MAUI SideDrawer Dobrinka Yordanova


I want to make the SideDrawer opacity consistent across different platforms in .NET MAUI. Currently, on iOS, a darkening mask is added over the SideDrawer MainContent when the drawer is extended (opened). However, on Windows, the MainContent appears to brighten. I would like to achieve consistency in this behavior.


To achieve consistent behavior for the SideDrawer content across different platforms, you can adjust the fade opacity when the drawer opens using the DrawerTransitionFadeOpacity property. The fade opacity value ranges from 0 to 1, where 0 represents no opacity and 1 represents full opacity. You can specify decimal values to better fit your specific scenario (0.1, 0.2, etc.).

Here's an example of how to set the DrawerTransitionFadeOpacity property. The DrawerTransitionFadeOpacity property is set to 0 for iOS and 1 for WinUI. This ensures that the darkening mask is not applied on iOS and the MainContent appears consistent across platforms.

<controls:RadSideDrawer x:Name="drawer" 
                         DrawerTransitionFadeOpacity="{OnPlatform WinUI=1, iOS=0}"


  • The SideDrawer control has different implementations for iOS, Android, and WinUI, which is why the behavior differs across platforms.
  • Adjusting the DrawerTransitionFadeOpacity property allows you to achieve consistency in the SideDrawer content across different platforms.
  • Make sure to set the appropriate value for the desired platform, taking into account the range from 0 to 1.

See Also

In this article