当折叠工具栏收起时隐藏浮动按钮

Question

我有一个包含可折叠工具栏、嵌套滚动视图和浮动按钮的协调布局。 我的浮动按钮位于可折叠工具栏的右下角。 我希望在可折叠工具栏完全折叠时该按钮消失，在其他情况下可见。

我的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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="fr.djey.secretapp.MainActivity">

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

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

            <ImageView
                android:id="@+id/collapsing_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="parallax"
                android:scaleType="centerCrop"
                android:src="@drawable/welcome"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_collapseMode="pin"/>

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

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_gravity="fill_vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/content_frame">

        </FrameLayout>

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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="-60dp"
        android:layout_marginRight="16dp"
        android:src="@android:drawable/ic_dialog_email"
        app:layout_anchor="@id/collapse_toolbar"
        app:layout_anchorGravity="bottom|right|end" />

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

这可行吗？如果可以，怎么做？

- Jey10

Answer 1

尝试这个小改变

<android.support.design.widget.FloatingActionButton
    ...
    app:layout_anchor="@id/appBar"
    app:layout_anchorGravity="bottom|right|end" />

- Radu Ionescu

---

谢谢，这很完美！但您能告诉我如何在Java中检查此折叠状态，以便在其折叠时更改锚点状态吗？ - Jey10

你尝试过这里的解决方案吗？Android Collapsingtoolbarlayout Collapse Listener - Radu Ionescu

谢谢，我尝试将其放在Java的onCreate中：appBar.addOnOffsetChangedListener（new AppBarLayout.OnOffsetChangedListener（）但是我在这一行上得到了一个nullpointerexception。 - Jey10

也许您忘记使用findViewById()或其他在onOffsetChanged()方法中引用的视图来初始化appBar视图。 - Radu Ionescu

如果FloatingActionButton位于一个布局（xml）文件中，而AppBar位于不同的布局文件中，那该怎么办呢？ - eawedat

Answer 2

将偏移监听器设置到工具栏上会给您更多的灵活性：当工具栏折叠/展开时，您可以决定发生什么。

    appBarLayout.addOnOffsetChangedListener(
    AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
    if (verticalOffset == 0) {
        showFAB()
        // logic when toolbar is open (for example show fab)
     } else {
        hideFAB()
        // logic when toolbar has collapsed (for example hide fab)
     })

如果您想知道工具栏是否在中间，或者需要Java代码，请查看以下链接：https://dev59.com/c1wZ5IYBdhLWcg3wFM3D#39424318

- Amir Golan