android - 缓慢滚动 RecyclerView 项目时,附有 anchor 的 float 操作按钮不会隐藏

标签 android android-design-library android-coordinatorlayout

我在底部提供了设计。

我希望在选项卡布局上方发生的事情:

  1. 我想要一个 AppBarLayout,它会在用户在其中一个选项卡中的 RecyclerView 上向下滚动时隐藏。
  2. 我希望用户图像附加到其背后的蓝色背景,并在用户向下滚动时隐藏。
  3. 我希望在用户滚动时将选项卡固定在顶部,以便他可以轻松切换它们。回收站 View 和选项卡布局必须是用户向下滚动时唯一可见的内容。

所以我确实实现了 1 和 3,但我无法实现 2 - 当您缓慢滚动 RecyclerView 时,图像会停留在它上面并且不会隐藏。

这是我做过的事情:

  1. 我确实只在此处显示的 fragment 中实现了协调器布局。它未在新 Activity 或托管 fragment 的 Activity 中实现,并且 fragment 没有工具栏。这意味着我使用的是没有工具栏的 CollapsingToolbarLayout。
  2. 我正在使用支持设计库中的 float 操作按钮来显示用户图像。我使用它是因为当它隐藏时会使用动画。

检查底部的 XML。

那么会发生什么:

  1. 一切都完美加载
  2. 按钮安装在正确的位置
  3. AppBarLayout 响应滚动
  4. 缓慢滚动时按钮不会隐藏
  5. 快速滚动时它会隐藏
  6. 当更改 viewpager fragment 时它会隐藏

这是一个有问题的视频:YOUTUBE

我尝试调试 CoordinatorLayout 以及当它调用按钮的 hide() 方法时,但我找不到问题所在。有什么想法吗?

编辑 1:

如果在奶酪方 block 示例中删除工具栏,您将遇到相同的错误。

我的测试 xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:clickable="true"
    android:background="@color/bg_secondary"
    android:fitsSystemWindows="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:elevation="1dp"
        android:fitsSystemWindows="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:contentScrim="?attr/colorPrimary"
            android:fitsSystemWindows="true">

            <ImageView
                android:id="@+id/img"
                android:src="@drawable/header_bg"
                android:scaleType="centerCrop"
                android:cropToPadding="true"
                app:layout_collapseMode="parallax"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>


    <android.support.v4.view.ViewPager
        android:id="@+id/profile_tabs"
        android:elevation="2dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:elevation="1dp"
        app:pressedTranslationZ="12dp"
        android:clickable="true"
        app:rippleColor="@android:color/transparent"
        android:src="@drawable/ic_launcher"
        app:layout_collapseMode="parallax"
        app:layout_anchor="@id/app_bar_layout"
        app:layout_anchorGravity="bottom|left|end" />

</android.support.design.widget.CoordinatorLayout>

Sample design

编辑 2:

还有一个 issue marked as Declined对于这个问题。

最佳答案

您必须为 FAB 实现自定义行为才能达到您想要的效果。 我稍微改变了原来的实现,让它在没有工具栏的情况下工作。

    public class FABBehavior extends FloatingActionButton.Behavior {

    public FABBehavior() {
    }

    public FABBehavior(Context context, AttributeSet attributeSet) {
    }

    public boolean onDependentViewChanged(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
        if(dependency instanceof Snackbar.SnackbarLayout) {
           return super.onDependentViewChanged(parent, child, dependency);
        } else if(dependency instanceof AppBarLayout) {
            this.updateFabVisibility(parent, (AppBarLayout)dependency, child);
        }

        return false;
    }

    private boolean updateFabVisibility(CoordinatorLayout parent, AppBarLayout appBarLayout, FloatingActionButton child) {
        CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams)child.getLayoutParams();
        if(lp.getAnchorId() != appBarLayout.getId()) {
            return false;
        } else {

            ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams) child.getLayoutParams();
            int point = child.getTop() - params.topMargin;
            try {
                Method method = AppBarLayout.class.getDeclaredMethod("getMinimumHeightForVisibleOverlappingContent");
                method.setAccessible(true);
                if(point <= (int) method.invoke(appBarLayout)) {
                    child.hide();
                } else {
                    child.show();
                }
                return true;
            } catch (Exception e) {
                return true;
            }
        }
    }
}

当然,您可以使用 app:layout_behavior 应用此行为。

关于android - 缓慢滚动 RecyclerView 项目时,附有 anchor 的 float 操作按钮不会隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32125505/

相关文章:

android - 未安装应用程序的 Facebook 登录重定向到登录页面

javascript - jquery mobile 中的动态点击处理不会出现 ui-state-active 类

android - 当父activity的状态必须保存时,你如何处理 fragment 事务?

android - TextInputLayout setError 方法在 24.2.0 中抛出 ClassCastException

android - 是否可以将持久 Bottom Sheet 作为 fragment ?

android - Two NavigationView 的工具栏中的汉堡包图标两侧带有后退箭头动画?

android - CoordinatorLayout 推送的 Actionbar

android - 在 TextView 中对齐第一行

android - 如何在 Android 中禁用 Snackbar 和 FAB 动画的 CoordinatorLayout

Android CoordinatorLayout 隐藏/覆盖主视图