Almost as soon as Android 10 made an appearance on Google’s new Pixel 3 phones, we started to get tickets from clients that the bottom of the screen had been covered by the Navigation Bar and there was no way to access essential functionality contained within the app.

How it looked in Android 10(Pixel 4 device):

Button at bottom of screen is hidden by Navigation Bar

How it previously looked in Android 9 (Samsung S8 device):

Buttons at bottom of screen are accessible

Finding a fix wasn’t particularly easy, especially as the app is written in a mixture of Xamarin Android and Xamarin Forms. The complaint was consistent across the app, regardless of which framework it was using though, so at least we could rule out this being a Xamarin only issue.

First of all, let’s look at what didn’t work

Google, Stack Overflow and the Xamarin forums came up with these suggestions, which you should try first. Unfortunately, none worked for me.

  • Setting a ScrollView or CoordinatorLayout as the root view.
  • Setting “fitsSystemWindows = “true”

Now let’s look at what did

The class for your activity will have to extend

View.IOnApplyWindowInsetsListener

which is in the Android.Views namespace. We also have to implement the interface, which we will do shortly.

These following two methods should be called in the OnStart() method of your activity:

public WindowInsets OnApplyWindowInsets(View v, WindowInsets insets)
        {
            return insets;
        }



protected override void OnStart()
        {
            base.OnStart();

            Window.DecorView.RequestApplyInsets();

            Window.DecorView.SetOnApplyWindowInsetsListener(this);
        }

This cleared up the issue of covering the buttons at the bottom of the screen. However it also threw up a couple of new bugs.

Status Bar and Navigation Bar Issues

The OnApplyInsets(View v, WindowInsets insets) method altered the Status Bar and Navigation Bar of the activity. By default it made them white, which is not what I wanted.

How it looked now:

No Status Bar and clear/white navigation bar

What it should have looked like:

Correct Status Bar and Navigation Bar

I therefore had to set the background of the status bar in the method by adding:

public WindowInsets OnApplyWindowInsets(View v, WindowInsets insets)
        {
            v.SetBackgroundColor(Android.Graphics.Color.Black);
            return insets;
        }

To make sure that an unwanted background was not being applied to other page elements, such as a busy spinner, I also added the following catch:

public WindowInsets OnApplyWindowInsets(View v, WindowInsets insets)
        {
            if(insets.HasSystemWindowInsets)
            {
                v.SetBackgroundColor(Android.Graphics.Color.Black);
            }

            return insets;
        }

That just about covers it. Any comments or questions then please let me know.

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *