CODEWITHSUNDEEP
androidlistviewandroid-listviewnavigationbar
Bart Bergmans
Bart Bergmans

Reputation: 4121

Bottom soft NavigationBar overlaps my ListView

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>

Upvotes: 16

Views: 23163

Answers (7)

Qadeer Muniry
Qadeer Muniry

Reputation: 139

Add in your themes.xml

<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:windowTranslucentNavigation">true</item>

In Activity before setContentView(view) set transparent color to status bar

 window.statusBarColor = Color.TRANSPARENT

Upvotes: 0

MartianMartian
MartianMartian

Reputation: 1859

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:

Upvotes: 0

Zain
Zain

Reputation: 40878

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;
    }
}

Upvotes: 4

kvadityaaz
kvadityaaz

Reputation: 1491

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:-

enter image description here

Upvotes: 1

Fouad
Fouad

Reputation: 855

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.

Upvotes: 4

Alex Mensak
Alex Mensak

Reputation: 168

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.

Upvotes: 4

Ken Cole
Ken Cole

Reputation: 473

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>

Upvotes: 45

Related Questions