时间戳

首页 > 解决方案 > 展开时如何防止FAB覆盖BottomSheet？

android - 展开时如何防止FAB覆盖BottomSheet？

问题描述

我在我的 Android 应用程序中使用 Material FAB 和 BottomSheet，我遇到了覆盖 BottomSheet 的 FAB 的一些问题，我会阻止它。

实际上，当BottomSheet1完全展开时，我有两个BottomSheet，我会将FAB放在BottomSheet后面，而当BottomSheet2为HalfExpanded时，我会在BottomSheet上方并在它完全展开时使其位于其后面。

我还试图让 BottomSheet 海拔高于 FAB 海拔，但它没有任何作用。

这是我的代码的样子：

<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/content"
    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"
    tools:context=".LetturaActivity">

        <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomAppBar"
        style="@style/Widget.MaterialComponents.BottomAppBar.Colored"
        android:layout_gravity="bottom"
        app:navigationIcon="@drawable/ic_baseline_menu_24"
        app:menu="@menu/bottom_app_bar"
        app:hideOnScroll="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" \>
   
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fabNuovo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/ic_add"
        android:elevation="4dp"
        app:tint="@color/white"
        android:contentDescription="@string/nuovo_documento"
        app:layout_anchor="@id/bottomAppBar"
        />


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

</androidx.coordinatorlayout.widget.CoordinatorLayout>

BottomSheet 父布局如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/bottomSheetTestata"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF"
    app:behavior_hideable="true"
    android:elevation="5dp"
    android:clickable="false"
    android:focusable="false"
    app:behavior_peekHeight="0dp"
    app:layout_behavior="@string/bottom_sheet_behavior"
    android:orientation="vertical">

   ...

<\LinearLayout>

但是当 BottomSheet 展开时看起来像这样：

在此处输入图像描述

标签： androidkotlinfloating-action-buttonbottom-sheet

解决方案

不是重叠就是重叠，问题是高程。

从文档中您可以看到所有元素都有不同的高度。

Fab 是6dp，虽然BottomSheet不容易找到，但应该是16dp（您可以使用浏览器功能作为关键字bottom）

因此，将您的海拔更改为

android:elevation="16dp"

推荐阅读