4

I am having an issue with my FabCradleMargin becoming less, almost flat, inside my Bottom App Bar when navigating through my app and scrolling up/down while hideonScroll is set to true. When the BottomAppBar hides from the screen, it returns resized under the Floating action Button. Must be a glitch in the new Android Material Components. Has anyone else been experiencing this issue. If so, what suggestions do you have to fixing it.

Before Image

and

After Image

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bar"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_gravity="bottom"
    app:elevation="4dp"
    app:fabAlignmentMode="center"
    app:fabCradleRoundedCornerRadius="2dp"
    app:hideOnScroll="true"
    app:layout_scrollFlags="scroll|enterAlways"
    app:navigationIcon="@drawable/ic_action_list" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:backgroundTint="@color/blue500"
    app:fabSize="normal"
    app:layout_anchor="@+id/bar"
    app:tint="@color/white"
    app:layout_anchorGravity="right"
    app:srcCompat="@drawable/ic_select_camera" />
hata
  • 11,633
  • 6
  • 46
  • 69
Gee_Mpn
  • 41
  • 4

1 Answers1

5

I stumbled upon this problem as well. In my case it depended on the way I tried to hide the BottomAppBar and the FloatingActionButton. This is what I had first (Kotlin):

private fun showBottomNavigationBar(barVisibility: Boolean, fabVisibility: Boolean) {
    navView.visibility = if (barVisibility) BottomAppBar.VISIBLE else BottomAppBar.GONE
    fab.visibility = if (fabVisibility) FloatingActionButton.VISIBLE else FloatingActionButton.GONE
}

And this is what fixed it:

private fun showBottomNavigationBar(barVisibility: Boolean, fabVisibility: Boolean) {
    navView.visibility = if (barVisibility) BottomAppBar.VISIBLE else BottomAppBar.GONE
    if (fabVisibility) fab.show() else fab.hide()
}

So instead of hiding the FloatingActionButton with the visibility property, I used the hide() and show() methods of the FloatingActionButton.

hata
  • 11,633
  • 6
  • 46
  • 69
Jeroen Flietstra
  • 177
  • 1
  • 10