CODEWITHSUNDEEP
c#androidmaui.net-maui
DanFlakes
DanFlakes

Reputation: 75

.NET MAUI Transparent Status Bar

How do I make the status bar transparent and show the content behind it on Android using .NET MAUI?

I've seen this post, is there a way to recreate this using C#?

Similar to Google Maps: enter image description here

Upvotes: 7

Views: 6019

Answers (2)

FreakyAli
FreakyAli

Reputation: 16547

Install version 1.3.0+ of CommunityToolkit.Maui, Gerald also has a video about it on YT:

And then in your ContentPage do something like:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:mct="clr-namespace:CommunityToolkit.Maui.Behaviors;assembly=CommunityToolkit.Maui"
             x:Class="MauiToolkitStatusBarBehaviorSample.MainPage">

<Page.Behaviors>
    <mct:StatusBarBehavior StatusBarColor="Transparent" StatusBarStyle="LightContent" />
</Page.Behaviors>

For other pages, you might want to set it up again since this behaviour is somewhat global and might effect other pages.

Upvotes: 4

Bas H
Bas H

Reputation: 2226

Try this , in MauiProgram.cs

    .ConfigureLifecycleEvents(events =>
            {
#if ANDROID
                events.AddAndroid(android => android.OnCreate((activity, bundle) => MakeStatusBarTranslucent(activity)));

                static void MakeStatusBarTranslucent(Android.App.Activity activity)
                {
                    activity.Window.SetFlags(Android.Views.WindowManagerFlags.LayoutNoLimits, Android.Views.WindowManagerFlags.LayoutNoLimits);

                    activity.Window.ClearFlags(Android.Views.WindowManagerFlags.TranslucentStatus);

                    activity.Window.SetStatusBarColor(Android.Graphics.Color.Transparent);
                }
#endif
            });

enter image description here

Upvotes: 8

Related Questions