Question

我想在材料指南规范中显示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的可见性变为GONE时，FAB按钮保持在其位置。

当CardView为GONE时，如何更新FAB的位置？

即使我在CardatorLayout中设置CardView并将其删除也无效。

Answer 1

好吧，问题是来自onDependentViewChanged的{{1}}仅在从属视图更改其位置时被调用。但我只是改变了它的可见性，所以它没有被调用。

现在在FloatingActionButton.Behavior我添加到视图并将其删除：

onClick

在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

这就是结果： GIF of result

Answer 2

根据此更改方法 layoutDependsOn 方法：

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

否则，fab按钮只会在第一次点击时向上移动。

显示CardView时的FAB行为（向上和向下）

2 个答案: