Shrink and extend function on new ExtendedFloatingActionButton in Material Components for Android is not working

user_3391825 0
Viewed 2889

I am using the new ExtendedFloatingActionButton from the Material Components for Android library 1.1.0-alpha06. It is rendered just fine but the 'extend' and 'shrink' methods are not doing anything.

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
                    android:id="@+id/extended_fab"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    app:layout_anchor="@id/bottom_sheet"
                    android:text="Drag map to change location"
                    app:icon="@drawable/my_location"
                    app:backgroundTint="@color/white"
                    app:iconTint="@color/quantum_googblueA200"
                    android:textColor="@color/quantum_googblueA200"
                    app:iconSize="18dp"
                    style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"
                    android:padding="4dp"
                    android:textSize="12sp"
                    android:textAllCaps="false"
                    android:layout_margin="8dp"
                    app:layout_anchorGravity="right|top"/>

Here's the rendered layout:

Rendered Layout

androidx material-design floating-action-button android
3 Answers

Here is a Kotlin version which matches the behavior of the built-in Contacts app. The FAB is extended whenever the RecyclerView is at the top, and the FAB shrinks whenever the user scrolls away from the top.

class FabExtendingOnScrollListener(
    private val floatingActionButton: ExtendedFloatingActionButton
) : RecyclerView.OnScrollListener() {
    override fun onScrollStateChanged(recyclerView: RecyclerView, newState: Int) {
        if (newState == RecyclerView.SCROLL_STATE_IDLE
            && !floatingActionButton.isExtended
            && recyclerView.computeVerticalScrollOffset() == 0
        ) {
            floatingActionButton.extend()
        }
        super.onScrollStateChanged(recyclerView, newState)
    }

    override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
        if (dy != 0 && floatingActionButton.isExtended) {
            floatingActionButton.shrink()
        }
        super.onScrolled(recyclerView, dx, dy)
    }
}

Usage:

recyclerView.addOnScrollListener(FabExtendingOnScrollListener(fab))
user_30958450

I have done this in my code.

recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
        @Override
        public void onScrollStateChanged(@NonNull RecyclerView recyclerView, int newState) {
            if (newState == RecyclerView.SCROLL_STATE_IDLE) {
                extendedFloatingActionButton.extend();
            }
            super.onScrollStateChanged(recyclerView, newState);
        }

        @Override
        public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {
            if (dy > 0 || dy < 0 && extendedFloatingActionButton.isExtended()) {
                extendedFloatingActionButton.shrink();
            }
        }
    });
user_46902980

For Kotlin users:

recyclerView.addOnScrollListener(object : RecyclerView.OnScrollListener() {
    override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
        super.onScrolled(recyclerView, dx, dy)
        if (dy > 0 && extendedFab.isExtended) {
            extendedFab.shrink()
        } else if (dy < 0 && !extendedFab.isExtended) {
            extendedFab.extend()
        }
    }
})
user_53731100
Related