android - 显示 CardView 时的 FAB 行为(向上和向下)

Question

我想像 Material Guidelines Specs 一样显示 CardView 作为提示: https://www.google.com/design/spec/growth-communications/onboarding.html#onboarding-quickstart

图片链接如下: Image

我已经像这样更改了 FAB 按钮的行为并设置为 .xml 文件:

public class FABBehavior extends FloatingActionButton.Behavior {

    public FABBehavior(Context context, AttributeSet attr) {
        super();
    }

    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
        return dependency instanceof CardView;
    }

    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
        float translationY = Math.min(0, dependency.getTranslationY() - dependency.getHeight());
        child.setTranslationY(translationY);
        return true;
    }
}

我的 .xml 文件如下所示:

<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
tools:context="com.nearme.client.activities.fragments.ScannerFragment">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:title="@string/title_scanner"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

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

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

<android.support.v7.widget.CardView
    android:id="@+id/cvBluetooth"
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:animateLayoutChanges="true"
    android:layout_gravity="bottom" >
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="Prueba" />
</android.support.v7.widget.CardView>

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="right|bottom|end"
    android:layout_margin="@dimen/fab_margin"
    app:layout_behavior="com.nearme.client.utils.FABBehavior"
    android:src="@android:drawable/ic_dialog_email" />

FAB 按钮的点击监听器是这样的:

View.OnClickListener onClick = new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (v == fab) {
            if (cardBluetooth.isShown()) {
                cardBluetooth.setVisibility(View.GONE);
            } else
                cardBluetooth.setVisibility(View.VISIBLE);
        }
    }
};

问题是当 CardView 的可见性消失时，FAB 按钮仍保持在其位置上。

当 CardView 消失时如何更新 FAB 的位置？

即使我在 CoordinatorLayout 中动态设置 CardView 并删除它也不起作用。

Answer 1

嗯，问题是 FloatingActionButton.Behavior 中的 onDependentViewChanged 仅在依赖 View 改变其位置时才会被调用。但我只是改变了它的可见性，所以它没有被调用。

现在在 onClick 中，我添加到 View 并将其删除:

View.OnClickListener onClick = new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (v == fab) {
            if (cardBluetooth.isShown()) {
                coordinatorLayout.removeView(cardBluetooth);
            } else
                coordinatorLayout.addView(cardBluetooth);
        }
    }
};

在 FloatingActionButton.Behavior 中我添加了:

@Override
public void onDependentViewRemoved(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
    child.animate().translationY(0);
    child.setTranslationY(0);
}

结果是这样的: GIF of result