【问题标题】:How to set fragment above bottom navigation view with xml?如何使用xml在底部导航视图上方设置片段?
【发布时间】:2019-12-01 04:43:36
【问题描述】:

我正在尝试在底部导航视图上方显示片段主机。但是底部导航视图占用了片段主机的一部分。我尝试了其他 SO 答案的解决方案,但仍然无法解决问题。 我使用了具有“layout_above”属性的相对布局和具有 realted 属性的约束布局,以将片段保持在底部导航视图之上。但是显示文本视图的片段仍然被底部导航视图截断。

这是我尝试过的 xml 代码: 相对布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?attr/actionBarSize">

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/nav_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginStart="0dp"
    android:layout_marginEnd="0dp"
    android:background="?android:attr/windowBackground"
    app:menu="@menu/bottom_nav_menu" />

<fragment
    android:id="@+id/nav_host_fragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@id/nav_host_fragment"
    android:layout_alignParentStart="true"
    app:defaultNavHost="true"
    app:navGraph="@navigation/mobile_navigation" />

    </RelativeLayout>

使用常量布局:

    <?xml version="1.0" encoding="utf-8"?>
<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/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="?attr/actionBarSize">

    <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: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" />

    <fragment
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/nav_view"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/mobile_navigation" />

</androidx.constraintlayout.widget.ConstraintLayout>

如何使用 xml 设置底部导航视图上方的片段主机?

【问题讨论】:

    标签: android android-fragments bottomnavigationview


    【解决方案1】:

    尝试使用线性布局

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    
        <fragment
            android:id="@+id/nav_host_fragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            app:defaultNavHost="true"
            app:navGraph="@navigation/mobile_navigation" />
    
        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/nav_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="0dp"
            android:layout_marginEnd="0dp"
            android:background="?android:attr/windowBackground"
            app:menu="@menu/bottom_nav_menu" />
    
    </LinearLayout>
    

    【讨论】:

    • 谢谢,它有效。但片段顶部和标题栏底部之后仍有一些空白区域。你知道为什么以及如何删除这个空白空间吗?
    • @Rifat 你能分享一些截图以便更好地理解吗?
    • @SyedAhmedJamil 我在 Erwin Kurniawan 的解决方案中添加了带有颜色代码的图片,以显示不需要的空白空间。看起来像是留下了一个隐藏的导航栏空间。
    【解决方案2】:

    将 paddingTop 替换为 0dp 值,为我解决了这个问题。

    <?xml version="1.0" encoding="utf-8"?>
    <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/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        
        android:paddingTop="0dp"
        android:paddingTop="?attr/actionBarSize" <!-- Delete this line -->
    
        android:layout_marginBottom="?attr/actionBarSize" <!-- If you have BottomNavigationView, add this line, so it doesn't overlap your list -->
    >
    

    【讨论】:

    • 不正确。虽然它确实解决了顶部,但如果您的内容很长,就像一个列表,它会被截断,因为 BottomNavigationView 在它前面重叠。
    • 你可以添加android:layout_marginBottom="?attr/actionBarSize",我也在处理长列表:)
    猜你喜欢
    • 1970-01-01
    • 2020-10-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-13
    • 1970-01-01
    • 2022-11-03
    相关资源
    最近更新 更多