BottomAppBar inside BottomNavigationView adds rectangle

[Madina-S]

When BottomNavigationView is added inside BottomAppBar, offset rectangle appears. The below screenshot shows the behavior.

https://ibb.co/gDsm029

I tried to change insets and added the following code, but it does not work. ViewUtils.doOnApplyWindowInsets(bottomAppBar) { view, insets, initialPadding -> insets!! }

XML layout: `<?xml version="1.0" encoding="utf-8"?> <androidx.coordinatorlayout.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:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/darker_gray"> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentStart="true"/>

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomAppBar"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_gravity="bottom"
    app:fabAlignmentMode="center">

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigation"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@android:color/transparent"
        app:labelVisibilityMode="unlabeled"
        app:menu="@menu/menu_nav" />

</com.google.android.material.bottomappbar.BottomAppBar>

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/abCodeFloatingActionButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_anchor="@id/bottomAppBar" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>`

Android API version: 28

Material Library version: 1.2.0-alpha01 (before I used 1.1.0-apha02 and it was ok, but because of the bug connected with TextInputLayout cutout border when the hint is disabled, I moved to the last library version.)

Device: Samsung SM-A605FN (A6+)

[cesards]

+1 for this issue. If we want to have a menu provided by the BottomNavigationView inside the BottomAppBar, the parent clips the children even if we add the right flags to both NavigationView + BottomBar ->

android:clipChildren="false"
android:clipToPadding="false"

[adrian-hidothealth]

Is there any update?

[linjson]

should your open the "ViewUtils.doOnApplyWindowInsets" API?

[Orange1353]

You can work around the bug, if you add a background for BottomNavigationView:

background_transparent.xml

`<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >

`

[alisoleimani-android]

You can work around the bug, if you add a background for BottomNavigationView:

background_transparent.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="#00000000" /> </shape>

This solution worked for me, thank you my friend!

[drchen]

I'll close the issue as obsolete since with the new design of M3 (the floating action button appears in the middle of bottom app bar), the use case seems not making sense anymore, and we already have a workaround for the old design pre-M3.