如何在 android 的 ConstraintLayout 中重叠元素？答案

【问题标题】：How to overlap elements in a ConstraintLayout in android?如何在 android 的 ConstraintLayout 中重叠元素？
【发布时间】：2020-06-12 10:16:32
【问题描述】：

我在 android-studio 中查看了许多引用重叠元素的链接，但我找不到帮助我将浮动操作按钮重叠在底部导航栏上的解决方案。

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="44dp"
        app:layout_constraintBottom_toTopOf="@+id/nav_view"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"

        android:foregroundGravity="center"
         />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        app:layout_constraintHorizontal_weight="1"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

End Result

【问题讨论】：

查看此链接，这可能会对您有所帮助stackoverflow.com/questions/4182486/…

标签： android android-layout android-constraintlayout

【解决方案1】：

使用 constraintLayout，您可以像这样创建与另一个视图重叠的视图：

<android.support.constraint.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context=".MainActivity">


<Button
    android:id="@+id/button3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:text="Bottom nav bar"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    android:background="@color/colorAccent"
    app:layout_constraintHeight_percent="0.2"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent" />

<Button
    android:id="@+id/button4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="FAB"
    android:background="@color/colorPrimary"
    app:layout_constraintBottom_toTopOf="@+id/button3"
    app:layout_constraintEnd_toEndOf="@+id/button3"
    app:layout_constraintStart_toStartOf="@+id/button3"
    app:layout_constraintTop_toTopOf="@+id/button3" />

</android.support.constraint.ConstraintLayout>

看起来像这样：

【讨论】：

你能添加同样的蓝图吗？

【解决方案2】：

试试这个，你应该将FloatingActionButton的top和bottom锚定在top的BottomNavigationView中

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="44dp"
        app:layout_constraintBottom_toTopOf="@+id/nav_view"
        app:layout_constraintTop_toTopOf="@+id/nav_view"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
         />

【讨论】：