滚动/滑动标签时Android折叠工具栏

时间:2015-09-17 13:11:16

标签: android android-viewpager android-recyclerview android-toolbar android-tablayout

我在TabLayout / ViewPager中使用RecyclerView并在滑动过程中折叠工具栏时遇到了一个奇怪的问题。很难描述请查看以下视频:

https://www.dropbox.com/s/0ilwkqoagtbi67r/device-2015-09-17-150125.mp4?dl=0

当我开始滑动标签并且手指移动不是100%水平时,我的工具栏开始崩溃,因为它还记录了我的RecyclerView的垂直移动。在行动中,似乎工具栏正在跳跃,你可以在视频从第6章开始看到它。

这是我的布局:

<?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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="de.activities.MainActivity">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinatorLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/appBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <include layout="@layout/toolbar" />

            <android.support.design.widget.TabLayout
                android:id="@+id/tabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabGravity="fill"
                app:tabMode="fixed"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
        </android.support.design.widget.AppBarLayout>

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/white"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="end|bottom"
            android:layout_margin="16dp"
            android:src="@drawable/ic_filter_list_white_24dp" />
    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/drawer" />

</android.support.v4.widget.DrawerLayout>

1 个答案:

答案 0 :(得分:0)

编辑 - 只需获取23.1.0设计库并在工具栏布局中添加“| snap”属性:

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

       <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways|snap />
       -----
       -----

所以您不需要使用以下代码:

您是否尝试将layout_behaviour属性添加到AppBarLayout?

app:layout_behavior="AppBarLayoutSnapBehavior"

然后你需要创建类“AppBarLayoutSnapBehavior”:

public class AppBarLayoutSnapBehavior extends AppBarLayout.Behavior {

private ValueAnimator mAnimator;
private boolean mNestedScrollStarted = false;

public AppBarLayoutSnapBehavior(Context context, AttributeSet attrs) {
    super(context, attrs);
}

@Override
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                                   View directTargetChild, View target, int nestedScrollAxes) {
    mNestedScrollStarted = super.onStartNestedScroll(coordinatorLayout, child, directTargetChild, target, nestedScrollAxes);
    if (mNestedScrollStarted && mAnimator != null) {
        mAnimator.cancel();
    }
    return mNestedScrollStarted;
}

@Override
public void onStopNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child, View target) {
    super.onStopNestedScroll(coordinatorLayout, child, target);

    if (!mNestedScrollStarted) {
        return;
    }

    mNestedScrollStarted = false;

    int scrollRange = child.getTotalScrollRange();
    int topOffset = getTopAndBottomOffset();

    if (topOffset <= -scrollRange || topOffset >= 0) {
        // Already fully visible or fully invisible
        return;
    }

    if (topOffset < -(scrollRange / 2f)) {
        // Snap up (to fully invisible)
        animateOffsetTo(-scrollRange);
    } else {
        // Snap down (to fully visible)
        animateOffsetTo(0);
    }
}

private void animateOffsetTo(int offset) {
    if (mAnimator == null) {
        mAnimator = new ValueAnimator();
        mAnimator.setInterpolator(new DecelerateInterpolator());
        mAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                setTopAndBottomOffset((int) animation.getAnimatedValue());
            }
        });
    } else {
        mAnimator.cancel();
    }

    mAnimator.setIntValues(getTopAndBottomOffset(), offset);
    mAnimator.start();
}

应该适合你。