主要活动BottomNavigationView重叠片段内容

时间:2020-10-04 09:43:51

标签: android overlap bottomnavigationview

我是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)代表用户在BottomNavigationView中选择一个项目时显示的片段内容。因此,当用户单击中心项目时,将显示以下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>

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

我尝试了类似app:layout_constraintBottom_toTopOf="@+id/bottom_navigation"而不是app:layout_constraintBottom_toBottomOf="parent"的操作,但是我的片段中看不到bottom_navigation ... screenshot for this

我不知道如何告诉我的ViewPager2将自己置于BottomNavigationView上方...

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

编辑

我忘记告诉我要保持我的BottomNavigationView与我的Google地图片段重叠。未来的发展之一是,当用户移动地图时,将显示在地图上的所有组件(BottomNavigationView,FloatingButton)设置为可见。给用户全屏谷歌地图。一段时间不活动后,组件将变为可见。

app:layout_constraintBottom_toTopOf="@id/bottom_navigation"添加到activity_main.xml时,ViewPager2正确显示在我的bottom_navitation上。但是当bottom_navigation GONE消失时,地图将被拉伸。当bottom_navigation变为可见时,地图将被展平。

1 个答案:

答案 0 :(得分:0)

在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>