Fab bar 未显示在嵌套滚动视图上答案

【问题标题】：Fab bar not showing over nested scroll viewFab bar 未显示在嵌套滚动视图上
【发布时间】：2018-08-04 15:14:12
【问题描述】：

我已经关注了很多答案，并试图在嵌套滚动视图上显示 fab bar，但我未能实现这一目标

我的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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
>


    <android.support.v4.widget.NestedScrollView
        android:id="@+id/nested_scroll_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:fillViewport="true"
        android:scrollbars="none"
        android:scrollingCache="true">
        <LinearLayout
            android:id="@+id/billBlock"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <android.support.v7.widget.RecyclerView
                android:id="@+id/allJobsheetList"
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            </android.support.v7.widget.RecyclerView>


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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end|right"
        android:gravity="center_horizontal"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:orientation="vertical">


        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_mic"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/spacing_middle"
            android:clickable="true"
            android:tint="@color/grey_80"
            app:backgroundTint="@color/grey_20"
            app:fabSize="mini"
            app:rippleColor="@android:color/white"
            app:srcCompat="@drawable/ic_mic" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_call"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/spacing_middle"
            android:clickable="true"
            android:tint="@color/grey_80"
            app:backgroundTint="@color/grey_20"
            app:fabSize="mini"
            app:rippleColor="@android:color/white"
            app:srcCompat="@drawable/ic_photo_camera" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/showFilterView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/spacing_smlarge"
            android:layout_marginLeft="@dimen/spacing_smlarge"
            android:layout_marginRight="@dimen/spacing_smlarge"
            android:layout_marginTop="@dimen/spacing_middle"
            android:clickable="true"
            android:tint="@android:color/white"
            app:fabSize="normal"
            app:rippleColor="@android:color/white"
            app:srcCompat="@drawable/ic_add" />

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

在上面的 xml fab 栏中，嵌套滚动视图的末尾显示不在右下角的固定位置。我是 android 新手，任何人都可以帮助我如何实现这一目标

How to add floating action button on top of scrollview

Create the Layout with CardView and Floating Action Button Android

FrameLayout does not match the height of NestedScrollView

【问题讨论】：

align parent bottom 和 align parent right 用于相对布局中分别固定底部/右侧的视图。在这种情况下它不会修复视图，您可以从底部添加边距到嵌套滚动视图，并相应地为线性布局提供高度。
要在 Coordinator Layout 中将一个子元素与另一个子元素对齐，请使用锚点或布局重力为其赋予重力，并利用 coordinator 行为使 fab 成为 coordinator 布局的直接子元素。
@Kaveri.你能提供示例代码吗。谢谢

标签： java android android-nestedscrollview

【解决方案1】：

进行了一些更改，将 fab 设为 coordinator layout 的直接子级，并使用 archor app:layout_anchor="@id/nested_scroll_view" app:layout_anchorGravity="bottom|right|end" 并相对于嵌套的滚动视图对齐 fab。

`<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
>
<android.support.v4.widget.NestedScrollView
    android:id="@+id/nested_scroll_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true"
    android:scrollbars="none"
    android:scrollingCache="true">
    <LinearLayout
        android:id="@+id/billBlock"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.v7.widget.RecyclerView
            android:id="@+id/allJobsheetList"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </android.support.v7.widget.RecyclerView>

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

<!--<LinearLayout-->
    <!--android:layout_width="wrap_content"-->
    <!--android:layout_height="wrap_content"-->
    <!--android:gravity="center_horizontal"-->

    <!---->
    <!--android:orientation="vertical">-->


    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_mic"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_anchor="@id/nested_scroll_view"
        app:layout_anchorGravity="bottom|right|end"
        android:layout_marginRight="10dp"
        android:clickable="true"
        android:layout_marginBottom="130dp"
        app:fabSize="mini"
        app:rippleColor="@android:color/white"
        android:src="@drawable/ic_launcher_background" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_call"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:clickable="true"
        android:layout_marginBottom="70dp"
        app:layout_anchor="@id/nested_scroll_view"
        app:layout_anchorGravity="bottom|right|end"
        app:fabSize="mini"

        app:srcCompat="@drawable/exo_controls_play" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/showFilterView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_anchor="@id/nested_scroll_view"
        app:layout_anchorGravity="bottom|right|end"
        android:clickable="true"
        android:tint="@android:color/white"
        app:fabSize="normal"
        app:rippleColor="@android:color/white"
        app:srcCompat="@drawable/exo_controls_next" />
<!--</LinearLayout>-->
</android.support.design.widget.CoordinatorLayout>

【讨论】：

@Kaveri.Thanks 我已经这样做了，但现在我的问题是我需要在滚动条上隐藏底部导航视图，但我在每个片段中都嵌套了滚动条
抱歉回复晚了，所以你的意思是在滚动时隐藏（动画）底栏并在反向滚动时显示它？
@Kaveri.yes 完全正确。之前我在嵌套滚动视图中使用框架布局，但如果我添加，那么我的工厂将无法正确定位
实现此行为的一种方法是为底部栏设置 layout_behaviour，但这需要协调器布局作为根父级。此链接可能对您有所帮助：-stackoverflow.com/questions/34715732/…

【解决方案2】：

这种布局可以正常工作。请检查 res/drawable 文件夹中是否有 ic_add、ic_mic、ic_photo_camera。删除这些，我可以看到如下视图 screenshot

【讨论】：

我可以看到图标，但如果滚动中有较大的内容行，则它会显示在 ciew 的末尾