主ActivityBottomNavigationView重叠Fragment内容

Question

我是 Android 开发新手，遇到了一些关于 BottomNavigationView 和重叠的问题。

这是我的应用程序在一切正常时的样子： ViewPager2 without BottomNavigationView

当用户单击 Google 标记时，我有一个 GoogleMap 全屏片段和一个 ViewPager2 可见（查看详细信息）

现在，当我添加我的 BottomNavigationView 时，它是这样的：BottomNavigationView overlapping my ViewPagers2

这是我的activity_main.xml：

<?xml version="1.0" encoding="utf-8"?><!--<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"-->
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/common_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/colorAccent"
        android:visibility="visible"
        app:itemIconTint="@drawable/bottom_navigation_colors"
        app:itemTextColor="@drawable/bottom_navigation_colors"
        app:labelVisibilityMode="unlabeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_navigation_menu"
        app:showAsAction="ifRoom" />


</androidx.constraintlayout.widget.ConstraintLayout>

FragmentContainerView (@+id/common_fragment) 表示当用户在底部导航视图中选择项目时显示的片段内容。因此，当用户点击中心项目时，会显示关注fragment_maps.xml

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/mainMapsLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:defaultNavHost="true">

    <!-- My Google Map fragment -->
    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/mapsFragment"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/nav_graph" />

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_marginBottom="16dp"
        android:clipToPadding="false"
        android:overScrollMode="never"

        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

问题是，当我在 @+id/viewPager 上指定 app:layout_constraintBottom_toBottomOf="parent" 时，父级与我的 Fragment 的 ConstraintLayout 相关。我不知道是否可以在我的 Fragment 中添加引用我的 Activity 父级中的组件的约束。

我已经尝试过类似app:layout_constraintBottom_toTopOf="@+id/bottom_navigation" 而不是app:layout_constraintBottom_toBottomOf="parent" 的方法，但在我的片段中看不到bottom_navigation...screenshot for this

我不知道如何告诉我的 ViewPager2 将自己定位在我的 BottomNavigationView 上方...

如果您对我的问题有任何想法，或者我走错了路，请告诉我。

编辑

我忘了告诉我我想让我的 BottomNavigationView 与我的谷歌地图片段重叠。未来的发展之一是在用户移动地图时设置可见的 GONE 所有组件（BottomNavigationView、FloatingButton）出现在地图上。给用户一个全屏谷歌地图。并且组件会在一段时间不活动后变得可见。

将app:layout_constraintBottom_toTopOf="@id/bottom_navigation" 添加到我的activity_main.xml 时，我的ViewPager2 正确显示在我的bottom_navitation 顶部。但是当 bottom_navigation GONE 时，地图会被拉伸。而当 bottom_navigation 变为 VISIBLE 时，地图就会变平。

Answer 1

在您的 FragmentContainer 中，您使用了app:layout_constraintBottom_toBottomOf="parent"，这会导致问题。

你应该在 FragmentContainer 中使用app:layout_constraintBottom_toTopOf="@id/bottom_navigation"。这将允许片段高于 viewpager。

所以你的代码变成了这样：

<?xml version="1.0" encoding="utf-8"?><!--<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"-->
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/common_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/bottom_navigation"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/colorAccent"
        android:visibility="visible"
        app:itemIconTint="@drawable/bottom_navigation_colors"
        app:itemTextColor="@drawable/bottom_navigation_colors"
        app:labelVisibilityMode="unlabeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_navigation_menu"
        app:showAsAction="ifRoom" />


</androidx.constraintlayout.widget.ConstraintLayout>