Bottom app bar menu icons move when FAB hides

Question

I have a bottom app bar:

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomBar"
    android:layout_gravity="bottom"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    node:backgroundTint="?attr/toolbar"
    node:fabAlignmentMode="end"/>

And a FAB Button

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fabAddUser"
    android:src="@drawable/add_user"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    node:backgroundTint="?android:attr/colorAccent"
    node:fabSize="normal"
    node:layout_anchor="@id/bottomBar"
    node:rippleColor="?android:attr/colorPrimaryDark"
    node:tint="@color/white"/>

When the fab button is present at the bottom right of the screen everything functions as normal. My menu items are on the left side of the screen. When the fab button hides when the user scrolls the menu items move to the right-hand side of the phone. It's really annoying having the menu move from left to right when the FAB button is changing state. Is there any way to keep my menu item buttons always on the left side of the Bottom App Bar.

Thanks in advance!

EDIT #1

I have a recycler view in the layout with id userList. I am using this code to hide the fab button

userList.addOnScrollListener(object: RecyclerView.OnScrollListener() {
        override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {

            // What Happens When The User Is Scrolling Down//
            if (dy > 0) fabAddUser.hide()

            // What Happens When The User Is Scrolling Up//
            else fabAddUser.show()

            // Differ Action To Parent Class//
            super.onScrolled(recyclerView, dx, dy)
        }
    })

are you manually hiding FAB or using scroll behaviour in Coordinator layout.? — Pwn, Jan 29 '19 at 04:33
@bhardwaj, check above I added the code I use to hide the fab button — Jordan, Jan 29 '19 at 04:36
can you try removing the `fabAlignmentMode` from your bottom bar — Vivek Mishra, Jan 29 '19 at 04:39
according to bottom app bar docs "When no floating action button is needed, the bottom app bar can accommodate a navigation menu icon and up to four actions aligned on the opposing edge." ... — Pwn, Jan 29 '19 at 04:43
It moves the fab button to the middle, the icons stay on the right and don't move which is good but what I am really looking for is for the icons to stay on the left, not the right. I feel like the FAB is better suited to the right of the screen for my layout instead of in the middle — Jordan, Jan 29 '19 at 04:43
@Jordan you can try setting visibility INVISIBLE although there is RestrictedApi warning but it may works — Pwn, Jan 29 '19 at 04:44
so it kind of works, the fab dissapears button the divet in the bottom bar does not go away so it looks wierd — Jordan, Jan 29 '19 at 04:46
I have three menu Items that show up on the left side when the fab is present. I dont even know why they move when it hides. The menu items are no where near the fab button — Jordan, Jan 29 '19 at 04:47
@Jordan as docs says its property of bottom app bar that it accommodate navigation menu icon when FAB visibility gone — Pwn, Jan 29 '19 at 04:51
I don't understand why they would not give the option to not have it move and just stay on the left it's weird having it move back and forth all the time — Jordan, Jan 29 '19 at 04:53
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/187461/discussion-between-bhardwaj-and-jordan). — Pwn, Jan 29 '19 at 04:55

Bottom app bar menu icons move when FAB hides

0 Answers0