How to ensure CoordinatorLayout children do not overlap

Question

I am using bottom app bar inside the coordinator layout. the rest of the content is coming from a fragment. the fragment content is being covered by the bottom app bar

Because I am using bottomAppBar it has to be inside a CoordintorLayout and all the children have to be inside of it as well. All layout above the BottomAppBar should fill the space reminding, but if I do so the views at the bottoms get covered. how do I ensure the view do not overlap with BottomAppBar

<androidx.drawerlayout.widget.DrawerLayout
android:id="@+id/drawerLayout_main"
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".main.MainActivity">

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:id="@+id/coordinatorLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content">

    </androidx.constraintlayout.widget.ConstraintLayout>

    <fragment
        android:id="@+id/fragment_main_navHost"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        android:layout_gravity="top"
        app:navGraph="@navigation/nav_graph"/>


    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomAppBar_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:fabAlignmentMode="end"
        app:fabCradleMargin="4dp"
        app:hideOnScroll="true"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

<com.google.android.material.navigation.NavigationView
    android:id="@+id/navView_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:headerLayout="@layout/nav_header_layout"
    app:menu="@menu/main_navigation"/>

What I need is to ensure whatever content is replacing the fragment should not be covered by the bottom app bar and it should use all the white space not being used the bottom app bar. I another world the content should be above it while using rest the white space and still be inside the coordinator layout.

Answer 1

Just add margin to your fragment container :

  <fragment
    android:id="@+id/fragment_main_navHost"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="{bottom_navigation_height}"
    android:layout_marginTop="{tool_bar_height}"
    app:defaultNavHost="true"
    android:layout_gravity="top"
    app:navGraph="@navigation/nav_graph"/>