[Snackbar] FAB shortly jumps up, before the Snackbar slides in from the bottom

[sergejsha]

Description: As it can be seen in the 2 second of this video, which shows 3x slowed down Snackbar's slide-in animation, right before the FAB button get pushed up, it shortly jumps up (which is wrong) and only then gets pushed as expected. It looks there are just few drawing frames where the FAB is misplaced, but the effect is visually unpleasant.

Expected behavior: FAB button follows the slide-in movement of the Snackbar and doesn't jump.

Source code: Complete app can be cloned and imported from github.com/beworker/edge-to-edge. Once launched, the misbehaving example is "Toolbar + RecyclerView + FAB in CoordinatorLayout" one.

Layout: https://github.com/beworker/edge-to-edge/blob/master/app/src/main/res/layout/fragment_toolbar_with_scrollable_content_and_fab.xml

Fragment: https://github.com/beworker/edge-to-edge/blob/master/app/src/main/java/de/halfbit/edgetoedge/sample/examples/ToolbarWithScrollableContentAndFab.kt

Note: The issue can also be reproduced without edgeToEdge { } block, which can be removed completely.

Android API version: Reproduced with Android 10 on the emulator.

Material Library version: 1.2.0-alpha03 (latest)

Device: The Android Emulator.

[yshrsmz]

https://material.io/components/snackbars/#behavior
https://material.io/components/snackbars/#placement

According to the material design spec, Snackbar should be displayed above the FAB, not below.

[sergejsha]

Oups. You're right. I was absolutely sure the floating button should flow up and stay above the snackbar. Maybe because it looks super-ugly otherwise 😄 Closing the issue.

[leeroyhero]

I've find out a hack.
If you need place view above snackbar, you can try this

class MoveUpwardBehavior(context: Context?, attrs: AttributeSet?) :
CoordinatorLayout.Behavior<View>(context, attrs) {
constructor() : this(null, null)

override fun layoutDependsOn(
    parent: CoordinatorLayout,
    child: View,
    dependency: View
): Boolean {
    return dependency is Snackbar.SnackbarLayout
}

override fun onDependentViewChanged(
    parent: CoordinatorLayout,
    child: View,
    dependency: View
): Boolean {
    val translationY = min(0f, dependency.translationY - dependency.height)
    if (dependency.translationY != 0f)
        child.translationY = translationY
    return true
}
}

And in your layout

   <YourView
            android:layout_gravity="bottom|center_horizontal"
            app:layout_behavior="PATH_TO_CLASS.MoveUpwardBehavior"
            />

Of course rootview must be CoordinatorLayout

[T1mmyK0]

@leeroyhero This is great! Just one issue. If you swipe the snackbar away, the FAB doesn't come back down. Just also override onDependentViewRemoved and set the child translationY to 0 there.