question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Setting HideBottomViewOnScrollBehavior to BottomAppBar will incorrectly position anchored FAB

See original GitHub issue

Overview

Setting app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior" to the BottomAppBar with a FloatingActionButton anchored to it will produce the unexpected behavior. I thought it would follow the bottom app bar scrolling behavior

Misplaced FAB

Reproduction steps

Below is the causing layout resource file.

<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"
    tools:context=".MainActivity"
    tools:showIn="@layout/activity_main">

    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottom_app_bar"
        style="@style/Widget.MaterialComponents.BottomAppBar.Colored"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:layout_gravity="bottom"
        android:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.MaterialComponents.Light"
        app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:tint="@color/color_on_secondary"
        app:layout_anchor="@id/bottom_app_bar"
        app:fabSize="normal"
        app:srcCompat="@drawable/ic_twotone_public_24px" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Version number

  • 1.0.0-alpha3

Operating system and device

  • Samsung A3 running Android 5.0

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:8

github_iconTop GitHub Comments

2reactions
StephaneBgcommented, Jun 25, 2018

Hello, you should try that:

<com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomBar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:layout_gravity="bottom"
        app:backgroundTint="@color/blue_500"
        app:fabAttached="true"
        app:hideOnScroll="true"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        />
0reactions
SrinivasaRaoMakkenacommented, Jul 12, 2022

The scrolling behavior is working for me, but there seems to be a bug. When the bottomappbar is hidden, there is a white background still showing. Wondering if you have encountered this problem?

Observing the similar issue, any solution to this? Thanks.

Read more comments on GitHub >

github_iconTop Results From Across the Web

I have a FAB anchored to a bottom bar that have a bugged ...
Try to nest your bottom bar and FAB in a container and hide/show that layout instead. XML layout: <androidx.coordinatorlayout.widget.
Read more >
HideBottomViewOnScrollBehavior - Android Developers
Slides the child with or without animation from its current position to be totally on the screen. Inherited methods. From class androidx.coordinatorlayout.
Read more >
Bottom App Bar - Material Design Android Studio - YouTube
HiI am Shafaqat Ali & Welcome to My youtube channel Technical Skillz.About this video:This video is about android development main focus of ...
Read more >
Flutter Tutorial - BottomAppBar With Centered FAB - YouTube
Write a stylish BottomAppBar with a centered Floating Action Button.Click here to Subscribe to ... Your browser can 't play this video.
Read more >
BottomAppBar onHide listener - Damian Terlecki
A very interesting property of the BottomAppBar component is hideOnScroll. Setting its value to true causes the bar to hide or appear when ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found