I have a FloatingActionButton that implements a behavior for hiding it when scrolling down, and showing it when scrolling up.
However, sometimes when I scroll up, it hides itself and then reappears again. This isn't understandable according to my code, since it's supposed to hide only when scrolling down.
Perhaps it's connected with my CollapsingToolbar that is also scrolling?
This is my layout:
<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout 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" android:layout_gravity="right" android:focusableInTouchMode="true" android:clickable="true" android:layoutDirection="rtl" android:fitsSystemWindows="true" android:id="@+id/drawer_layout"> <android.support.design.widget.CoordinatorLayout android:id="@+id/mainCoordinatorLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:layoutDirection="rtl" android:background="#EEEEEE" android:clickable="true"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:fitsSystemWindows="true" android:id="@+id/toolbar_layout"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="256dp" android:fitsSystemWindows="true" app:layout_scrollFlags="scroll|exitUntilCollapsed" app:contentScrim="?attr/colorPrimary" app:collapsedTitleGravity="right|top" app:expandedTitleGravity="bottom|right" app:expandedTitleMarginBottom="64dp" app:collapsedTitleTextAppearance="@style/CollapsedTitleTextAppearance" app:expandedTitleTextAppearance="@style/ExpandedTitleTextAppearance" app:expandedTitleMarginEnd="0dp" app:expandedTitleMarginStart="30dp"> <ImageView android:id="@+id/headerImage" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" app:layout_collapseMode="parallax" android:background="@drawable/soldier" /> <View android:fitsSystemWindows="true" android:layout_width="match_parent" android:layout_height="100dp" android:background="@drawable/scrim_top" app:layout_collapseMode="pin" /> <View android:fitsSystemWindows="true" android:layout_width="match_parent" android:layout_height="88dp" android:layout_gravity="bottom" android:layout_alignBottom="@+id/headerImage" android:background="@drawable/scrim_bottom" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="104dp" android:gravity="top" app:titleTextColor="@color/White" android:layout_gravity="right" android:layoutDirection="rtl" app:layout_scrollFlags="scroll|enterAlways" app:layout_collapseMode="pin" app:contentScrim="?attr/colorPrimary" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:titleMarginTop="15dp" /> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:layout_gravity="bottom" app:tabIndicatorHeight="3dp" android:layoutDirection="ltr" app:tabIndicatorColor="@android:color/white" app:tabSelectedTextColor="@color/White" app:tabTextColor="@color/Black" style="@style/MyCustomTabLayout" app:tabMode="fixed" app:tabGravity="fill"> <android.support.design.widget.TabItem android:icon="@drawable/ic_book_white_24px" android:text="ספרים" /> <android.support.design.widget.TabItem android:icon="@drawable/soldierWhite" android:text="הלכות" /> <android.support.design.widget.TabItem android:icon="@drawable/ic_home_white_24px" android:text="בית" /> </android.support.design.widget.TabLayout> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/content_frame" android:visibility="gone" android:animateLayoutChanges="true" app:layout_behavior="@string/appbar_scrolling_view_behavior" app:behavior_overlapTop="0dp"> </FrameLayout> <android.support.v4.view.ViewPager android:id="@+id/mainPager" app:layout_behavior="@string/appbar_scrolling_view_behavior" android:layout_width="match_parent" android:layout_height="match_parent" app:behavior_overlapTop="0dp" /> <android.support.design.widget.FloatingActionButton android:id="@+id/mainFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_gravity="bottom|end" android:layout_marginLeft="16dp" android:layout_marginBottom="16dp" android:layout_marginTop="5dp" android:elevation="8dp" app:layout_behavior="@string/fab_scroll_translation_autohide_behavior" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorAccent" android:src="@drawable/ic_perm_phone_msg_white_24px" /> <LinearLayout android:id="@+id/miniFabFrame" android:focusableInTouchMode="true" android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="invisible" android:layout_alignParentLeft="true" android:layout_gravity="bottom|end" android:layout_marginLeft="20dp" android:layout_marginBottom="80dp" android:padding="0dp"> <android.support.design.widget.FloatingActionButton android:id="@+id/messageFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:elevation="8dp" android:layout_marginTop="5dp" android:layout_marginRight="0dp" android:layout_marginBottom="5dp" android:layout_marginLeft="5dp" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorPrimary" app:fabSize="mini" android:src="@drawable/ic_textSMS_white_24px" /> <android.support.design.widget.FloatingActionButton android:id="@+id/callFab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_marginTop="5dp" android:layout_marginRight="0dp" android:layout_marginBottom="5dp" android:layout_marginLeft="5dp" android:elevation="8dp" app:pressedTranslationZ="12dp" app:backgroundTint="?android:colorPrimary" app:fabSize="mini" android:src="@drawable/ic_call_white_24px" /> </LinearLayout> </android.support.design.widget.CoordinatorLayout> <android.support.design.widget.NavigationView android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="right" android:id="@+id/nav_view" android:layoutDirection="rtl" app:headerLayout="@layout/header" app:menu="@menu/nav_menu" /> </android.support.v4.widget.DrawerLayout> This is my behavior:
[Register("ToratHamachane.ScrollAwareFABBehavior")] public class ScrollAwareFABBehavior : CoordinatorLayout.Behavior { public ScrollAwareFABBehavior(Context context, IAttributeSet attrs) : base(context, attrs) { } public override bool OnStartNestedScroll(CoordinatorLayout coordinatorLayout, Java.Lang.Object child, View directTargetChild, View target, int nestedScrollAxes) { return nestedScrollAxes == ViewCompat.ScrollAxisVertical || base.OnStartNestedScroll(coordinatorLayout, child, directTargetChild, target, nestedScrollAxes); } public override void OnNestedScroll(CoordinatorLayout coordinatorLayout, Java.Lang.Object child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) { base.OnNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed, dxUnconsumed, dyUnconsumed); var floatingActionButtonChild = child.JavaCast<FloatingActionButton>(); if (dyConsumed > 0 && floatingActionButtonChild.Visibility == ViewStates.Visible) floatingActionButtonChild.Hide(); else if (dyConsumed < 0 && floatingActionButtonChild.Visibility != ViewStates.Visible) floatingActionButtonChild.Show(); } } Any ideas why this might be happening? I'd appreciate any help.
Thanks.
2 Answers
Answers 1
Call super.
public ScrollAwareFABBehavior(Context context, IAttributeSet attrs) : base(context, attrs){ super(); } If this will not solve your problem, add behavior to your collapsingtoolbar.
And why you do that?
var floatingActionButtonChild = child.JavaCast<FloatingActionButton>(); You can just use the child instead floatingActionButtonChild.
Answers 2
Use this call to set the scroll behaviour of your floating action button.
public class ScrollAwareFabBehaviour extends FloatingActionButton.Behavior { public ScrollAwareFabBehaviour(Context context, AttributeSet attrs) { super(); } @Override public boolean onStartNestedScroll(final CoordinatorLayout coordinatorLayout, final FloatingActionButton 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 FloatingActionButton 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 && child.getVisibility() == View.VISIBLE) { // User scrolled down and the FAB is currently visible -> hide the FAB child.hide(); } else if (dyConsumed < 0 && child.getVisibility() != View.VISIBLE) { // User scrolled up and the FAB is currently not visible -> show the FAB child.show(); } } } and in your xml, where you have designed your FAB set its behaviour
<android.support.design.widget.FloatingActionButton android:id="@+id/fab_add_note" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|right" android:layout_margin="@dimen/fab_margin" android:clickable="true" android:src="@drawable/ic_add_white_24dp" app:backgroundTint="@color/blue_grey_accent_color" app:layout_anchor="@id/recycler_notes" app:layout_anchorGravity="bottom|right|end" app:layout_behavior="@string/fab_behaviour" app:rippleColor="#FFF" /> in strings.xml define your behavioural class like this
<string name="fab_behaviour">com.suman.swets.example.uiviews.ScrollAwareFabBehaviour</string> 
0 comments:
Post a Comment