android Bottom app bar is not taking full width even after setting width to match parent

Question

My bottom app bar is holding bottom navigation view and its shoqing little black strip on left side(pls check Screenshot ) even after setting width to match_parent.

It works fine when I use bottom navigation view without bottom app bar but I want both of them together,

I have tried setting margins right but still it does not move to left and take full width.

My layout file is below,

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.recipeapp.marathi.activities.HomeActivity">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#ffffff">

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbarHome"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                app:title="@string/app_name"
                app:titleTextColor="@color/black" />

        </com.google.android.material.appbar.AppBarLayout>


        <include layout="@layout/content_main" />

        <com.google.android.gms.ads.AdView xmlns:ads="http://schemas.android.com/apk/res-auto"
            android:id="@+id/adView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|center_horizontal"
            android:layout_marginBottom="?attr/actionBarSize"
            ads:adSize="BANNER"
            ads:adUnitId="@string/admob_banner_adunit_id">

        </com.google.android.gms.ads.AdView>





        <com.google.android.material.bottomappbar.BottomAppBar
            android:background="@color/white"
            android:id="@+id/bottomappbar"
            android:layout_gravity="bottom"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:fabCradleMargin="10dp"
            app:fabCradleRoundedCornerRadius="10dp"
            app:fabCradleVerticalOffset="10dp">

            <com.google.android.material.bottomnavigation.BottomNavigationView
                android:id="@+id/bottom_navigation"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#fff"
                app:itemIconTint="@color/bottom_nav_item"
                app:itemTextColor="@color/bottom_nav_item"
                app:menu="@menu/nav_menu" />
        </com.google.android.material.bottomappbar.BottomAppBar>

        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/floatingActionButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/todo"
            android:src="@drawable/ic_share"
            app:layout_anchor="@id/bottomappbar"
            app:layout_anchorGravity="bottom|center" />

    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <com.google.android.material.navigation.NavigationView
        android:background="@drawable/round_nav"
        android:foreground="?attr/selectableItemBackground"
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:visibility="visible"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/menu_drawer_navigation" />

</androidx.drawerlayout.widget.DrawerLayout>

please help..

Answer 1

Relevant documentation

This question has also been awnsered here and here

app:contentInsetEnd="0dp"
app:contentInsetStart="0dp"

in your com.google.android.material.bottomappbar.BottomAppBar is but far the simplest

Sample code:

<com.google.android.material.bottomappbar.BottomAppBar
            android:background="@color/white"
            android:id="@+id/bottomappbar"
            android:layout_gravity="bottom"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:fabCradleMargin="10dp"
            app:fabCradleRoundedCornerRadius="10dp"
            app:contentInsetEnd="0dp"
            app:contentInsetStart="0dp"
            app:fabCradleVerticalOffset="10dp">

            <com.google.android.material.bottomnavigation.BottomNavigationView
                android:id="@+id/bottom_navigation"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#fff"
                app:itemIconTint="@color/bottom_nav_item"
                app:itemTextColor="@color/bottom_nav_item"
                app:menu="@menu/menu_drawer_navigation"
                />
</com.google.android.material.bottomappbar.BottomAppBar>

<com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/floatingActionButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher_background"
            app:layout_anchor="@id/bottomappbar"
            app:layout_anchorGravity="bottom|center" />