Bottom soft NavigationBar overlaps my ListView

Question

I ran my app on a Nexus 5 (Android 5) but I encountered the problem that the soft NavigationBar at the bottom overlaps the last item of my ListView. I've tried to add fitsSystemWindows to my style and the ListView but that didn't work.

The XML of my layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:background="@color/sf4l"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ListView android:id="@id/android:list"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@color/sf4l" />
</LinearLayout>

Answer 1

Add this to your themes.xml in a values-v21 dir:

<item name="android:windowDrawsSystemBarBackgrounds">false</item>

Example (I'm using AppCompat for actionbars):

<style name="Theme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="homeAsUpIndicator">@drawable/new_indicator</item>
    <item name="android:homeAsUpIndicator">@drawable/new_indicator</item>
    <item name="actionModeBackground">@android:color/black</item>
    <item name="android:windowDrawsSystemBarBackgrounds">false</item>
</style>

Answer 2

It's because height of your listView is equal full screen height but action bar pushes layout few pixel lower what causes layout overlap by navigation buttons.

This is also happening if you have full screen fragment container under action bar.

Fix for this is to mesure height of screen and of action bar, and then set height of your parent view to it's difference. Example:

@Override
public void onWindowFocusChanged (boolean hasFocus) {
    LinearLayout lMain = (LinearLayout) findViewById(R.id.lMain);
    lMain.getLayoutParams().height = lMain.getHeight() - getNavigationBarHeight();
}

• you have to do this after layout is already drawn/rendered. In onCreate or onResume is too early. Doing so in onWindowFocusChanged() is maybe litle overkill but it works.

Answer 3

I tried the accepted answer in this post and like many it didn't work for me.

However the following worker for me.

  <item name="android:windowTranslucentNavigation">false</item>

I placed in styles-21.xml

What is does is make the soft navigation bar have a solid background and somehow now components are rendered correctly.

Answer 4

This answer is kind of mixing other answers and my trials to achieve this Starting from API-15.

For API-21+

In styles.xml (v21) add below to the activity's style

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
     ....
    <item name="android:windowDrawsSystemBarBackgrounds">false</item>
</style>

For API-19+

In styles.xml (v19) add below to the activity's style

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
     ....
    <item name="android:windowTranslucentNavigation">false</item>
</style>

For API-15+

Override below in your activity

@Override
public void onWindowFocusChanged(boolean hasFocus) {
    // return for API-19+
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
        return;

    // Customize Activity to not overlap with the bottom software buttons
    // navigation bar (back, home, & menu)
    boolean hasMenuKey = ViewConfiguration.get(this).hasPermanentMenuKey();
    boolean hasBackKey = KeyCharacterMap.deviceHasKey(KeyEvent.KEYCODE_BACK);

    if (!hasMenuKey && !hasBackKey) { // check if this device has a bottom navigation bar
        ConstraintLayout rootLayout = findViewById(R.id.activity_root); // my activity root layout
        int NAVIGATION_BAR_HEIGHT = 70;
        rootLayout.getLayoutParams().height = rootLayout.getHeight() - NAVIGATION_BAR_HEIGHT;
    }
}

Answer 5

Very easy solution. Simply use ConstraintLayout. Align the bottom edge of top view to the top edge of bottom view.

Sample is given below:-

xml:-

    <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<ListView
    android:id="@+id/list_item"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:divider="@color/black"
    android:dividerHeight="2dp"
    app:layout_constraintBottom_toTopOf="@+id/navigation"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="1.0"
    app:layout_constraintHorizontal_bias="1.0"></ListView>

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginEnd="0dp"
    android:layout_marginStart="0dp"
    android:background="?android:attr/windowBackground"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:menu="@menu/navigation" />
    </android.support.constraint.ConstraintLayout>

Output Design:-

Answer 6

no body mentioned insets..

View.setOnApplyWindowInsetsListener(new View.OnApplyWindowInsetsListener() {
        @Override
        public WindowInsets onApplyWindowInsets(View v, WindowInsets insets) {
            int bottomInset = insets.getSystemWindowInsetBottom();
            // Do something with the bottom inset value, such as adjusting the layout
            v.getPaddingBottom();// useless.
            insets.getSystemWindowInsetBottom(); // correct
            insets.getStableInsetBottom();

            return insets;
        }
    });

this code is only to point readers to right direction, not mean to be functionally correct. checkout this post: