Google have released Design library, I am using
compile 'com.android.support:design:22.2.1'
However I cant see any code examples of how to use this library and how to animate the FAB
bar on scroll. I guess I can listen for scroll events on the ListView
and then animate the button myself, but is this not baked into the API (is this not the point of this support library).
Is there examples for this ?
If you're using RecyclerView
and you're looking for something simple, you can try this:
recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener(){ @Override public void onScrolled(RecyclerView recyclerView, int dx, int dy){ if (dy > 0) fabAddNew.hide(); else if (dy < 0) fabAddNew.show(); } });
By replacing 0
with a constant, you can adjust the sensitivity of triggering, providing smoother experience
Making a component react to scroll events is most easily done with a custom CoordinatorLayout.Behavior, as they receive scroll events automatically when you override onStartNestedScroll().
An example Behavior that hides and shows the FAB on scroll found in this FABAwareScrollingViewBehavior, built on top of cheesesquare:
public class FABAwareScrollingViewBehavior extends AppBarLayout.ScrollingViewBehavior { public FABAwareScrollingViewBehavior(Context context, AttributeSet attrs) { super(context, attrs); } @Override public boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) { return super.layoutDependsOn(parent, child, dependency) || dependency instanceof FloatingActionButton; } @Override public boolean onStartNestedScroll( final CoordinatorLayout coordinatorLayout, final View child, final View directTargetChild, final View target, final int nestedScrollAxes) { // Ensure we react to vertical scrolling return nestedScrollAxes == ViewCompat.SCROLL_AXIS_VERTICAL || super.onStartNestedScroll(coordinatorLayout, child, directTargetChild, target, nestedScrollAxes); } @Override public void onNestedScroll( final CoordinatorLayout coordinatorLayout, final View child, final View target, final int dxConsumed, final int dyConsumed, final int dxUnconsumed, final int dyUnconsumed) { super.onNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed, dxUnconsumed, dyUnconsumed); if (dyConsumed > 0) { // User scrolled down -> hide the FAB List<View> dependencies = coordinatorLayout.getDependencies(child); for (View view : dependencies) { if (view instanceof FloatingActionButton) { ((FloatingActionButton) view).hide(); } } } else if (dyConsumed < 0) { // User scrolled up -> show the FAB List<View> dependencies = coordinatorLayout.getDependencies(child); for (View view : dependencies) { if (view instanceof FloatingActionButton) { ((FloatingActionButton) view).show(); } } } } }
Where your scrolling view would have app:layout_behavior="com.support.android.designlibdemo.FABAwareScrollingViewBehavior"
instead of app:layout_behavior="@string/appbar_scrolling_view_behavior"
However you can replace hide()
and show()
with any action if you want. Details on how this was done can be found in this post and the follow up post for v22.2.1 and the follow up post for v25.1.0.
Note that this, like all scrolling behaviors of the Design Library, require that your view supports nested scrolling, which currently limits you to NestedScrollView, RecyclerView - ListView
and ScrollView
only work on API21+ devices.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With