Bottom navigation bar overlapping viewpager in CoordinatorLayout Android

Question

I have a recycler view in viewpager but the last row of recycler view is not fully visible (ie partially visible) as the Bottom navigation view is overlapping the viewpager. How can I fix this issue?

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
    android:orientation="vertical"
    tools:context="com.booksummary.booksummaryvideos.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/my_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="#fff"
            android:elevation="4dp"
            android:gravity="start"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
            app:contentInsetLeft="0dp"
            app:contentInsetStart="0dp"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        </android.support.v7.widget.Toolbar>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />


    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="?android:attr/windowBackground"
        android:elevation="16dp"
        app:itemIconTint="@drawable/selector"
        app:itemTextColor="@drawable/selector"
        app:menu="@menu/navigation" />

    <!--android:background="?android:attr/windowBackground"-->

</android.support.design.widget.CoordinatorLayout>

score -2 · Answer 1 · answered Oct 01 '17 at 20:26

The problem is that the BottomNavigationViewis in fact overlapping yourViewPager...

You can either change your layout so that the ViewPager ends above the BottomNavigationView

or

You need to set bottom padding to the size of the BottomNavigationView on the RecyclerView and also (to ensure the padding is after the last item) clipToPadding="false"

Bottom navigation bar overlapping viewpager in CoordinatorLayout Android

1 Answers1