如何修复 Android 中滚动视图下方的底部导航栏？

Question

我有一个 activity，它在嵌套滚动视图中有多个卡片视图。我想修复底部的导航栏。但是每当我尝试在可滚动内容下方放置一个栏时，内容也会覆盖该栏。我试过将它包装在约束布局视图中，但这也不起作用。这是我的布局文件。

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


        <androidx.core.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/scroll_view">

            <LinearLayout
                android:orientation="vertical"
                android:layout_height="match_parent"
                android:layout_width="match_parent">

                <androidx.cardview.widget.CardView
                    xmlns:card_view="http://schemas.android.com/apk/res-auto"
                    android:id="@+id/card_view"
                    android:layout_width="match_parent"
                    android:layout_height="199dp"
                    android:layout_gravity="center"
                    card_view:cardCornerRadius="4dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp">

                    <TextView

                        android:id="@+id/info_text"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />

                </androidx.cardview.widget.CardView>

                <androidx.cardview.widget.CardView
                    xmlns:card_view="http://schemas.android.com/apk/res-auto"

                    android:id="@+id/card_view1"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:layout_gravity="center"
                    card_view:cardCornerRadius="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp">

                    <TextView

                        android:id="@+id/info_text1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />

                </androidx.cardview.widget.CardView>
                <androidx.cardview.widget.CardView
                    xmlns:card_view="http://schemas.android.com/apk/res-auto"

                    android:id="@+id/card_view2"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:layout_gravity="center"
                    card_view:cardCornerRadius="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp">

                    <TextView

                        android:id="@+id/info_text2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />

                </androidx.cardview.widget.CardView>

                <androidx.cardview.widget.CardView
                    xmlns:card_view="http://schemas.android.com/apk/res-auto"

                    android:id="@+id/card_view3"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:layout_gravity="center"
                    card_view:cardCornerRadius="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp">

                    <TextView

                        android:id="@+id/info_text3"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" />

                </androidx.cardview.widget.CardView>

            </LinearLayout>


        </androidx.core.widget.NestedScrollView>


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

</androidx.constraintlayout.widget.ConstraintLayout>

感谢任何形式的帮助。

Answer 1

您的 NestedScrollView android:layout_height="match_parent" 我认为这是问题所在。您应该将 BottomNavigationView 放在底部，并在父顶部和 BottomNavigationView 之间约束 NestedScrollView

Answer 2

您的 BottomNavigationView 缺少底部约束。向其中添加以下行以使其工作：

app:layout_constraintBottom_toBottomOf="parent"

潜在的问题是您的 NestedScrollView 有 android:layout_height="match_parent"，这将使其占据整个屏幕，因为您的 ConstraintLayout 也有 android:layout_height="match_parent"

通常应避免对 ConstraintLayouts 中的视图使用 match_parent。

Note: You cannot use match_parent for any view in a ConstraintLayout. Instead use "match constraints" (0dp).

参见 Android 文档 here

如何修复 Android 中滚动视图下方的底部导航栏？

How to fix bottom navigation bar below Scroll View in Android?

android

android-layout

bottomnavigationview