CoordinatorLayout 内带有 FloatingActionButton 的 BottomNavigationView 与位置不匹配答案

【问题标题】：BottomNavigationView with FloatingActionButton inside CoordinatorLayout dont match positionCoordinatorLayout 内带有 FloatingActionButton 的 BottomNavigationView 与位置不匹配
【发布时间】：2019-10-14 06:29:01
【问题描述】：

我想在滚动时隐藏底部栏，但 FAB 应该留在屏幕上。

如果我使用锚将FAB 放在BottomNavigationView 之上，但它会出现在它后面。

如果我将layout_insetEdge="bottom" 放入BottomNavigationView，那么它可以工作，但会使我的测试失败 (https://issuetracker.google.com/issues/70162122)，所以我目前无法使用它。

布局：

<?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:id="@+id/mainLayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:fitsSystemWindows="true"
  tools:context=".screens.main.MainActivity">

  <FrameLayout
    android:id="@+id/mainContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/scrolling_view_behaviour" />

  <android.support.design.widget.FloatingActionButton
    android:id="@+id/mainNewQuestionButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/spacing_8dp"
    app:layout_anchor="@+id/mainBottomNavigationView"
    app:layout_anchorGravity="top|right|end"
    app:srcCompat="@drawable/create_question"
    tools:visibility="visible" />

  <android.support.design.widget.BottomNavigationView
    android:id="@+id/mainBottomNavigationView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:itemBackground="@color/my_gray"
    app:itemIconTint="@drawable/selector_bottombar_item"
    app:itemTextColor="@drawable/selector_bottombar_item"
    app:layout_anchor="@id/mainContainer"
    app:layout_anchorGravity="bottom"
    app:layout_behavior="@string/hide_bottom_navigation_view_behaviour"
    app:menu="@menu/bottom_navigation_main" />

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

【问题讨论】：

标签： android android-coordinatorlayout material-components material-components-android android-bottomnav

【解决方案1】：

只需使用：

<androidx.coordinatorlayout.widget.CoordinatorLayout>

 <com.google.android.material.bottomnavigation.BottomNavigationView
      android:id="@+id/bottom_navigation"
      android:layout_gravity="bottom"
      .../>

  <com.google.android.material.floatingactionbutton.FloatingActionButton
      android:layout_gravity="top"
      app:layout_anchor="@id/bottom_navigation"
      app:layout_anchorGravity="top|end"
      />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

【讨论】：

【解决方案2】：

您似乎在这里遇到了Z-Ordering 问题。您可以尝试 fab.bringToFront() 后跟 fab.invalidate() 用于 API 低于 21，ViewCompat.setZ(fab, someFloat) 用于 API 高于 21。

我使用这些方法将一个自定义 FloatingActionMenu（由我为一个项目编写的一系列 FAB 组成）置于前面，以便它们与屏幕上的所有内容重叠。

【讨论】：