BottomNavigationView显示为细线的原因及修复方法

常见原因 #

• 未关联menu资源：BottomNavigationView依赖menu文件定义导航项，若未设置menu，组件会因无内容收缩成细线。
• 高度配置不合理：menu为空时设置wrap_content，或约束配置导致高度被强制压缩，都会出现细线状态。
• 主题或依赖缺失：未使用Material Design主题，或未引入Material组件依赖，导致组件样式无法正常渲染。

修复步骤 #

1. 创建并配置menu资源文件
   在res/menu目录下创建导航菜单文件（如bottom_nav_menu.xml），添加导航项：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/nav_home"
        android:icon="@drawable/ic_home"
        android:title="首页"/>
    <item
        android:id="@+id/nav_dashboard"
        android:icon="@drawable/ic_dashboard"
        android:title="仪表盘"/>
    <item
        android:id="@+id/nav_notifications"
        android:icon="@drawable/ic_notifications"
        android:title="通知"/>
</menu>

2. 修正布局文件中的BottomNavigationView配置
   确保绑定menu资源，同时设置正确的约束和高度：

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_nav"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:menu="@menu/bottom_nav_menu"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"/>

若需要固定高度，可将layout_height设为?attr/actionBarSize或56dp，适配Material Design规范。

3. 检查依赖与主题配置

• 在Module级别的build.gradle中确认Material组件依赖：

implementation 'com.google.android.material:material:1.9.0' // 版本可按需调整

• 确保App主题继承自Material Design主题（在res/values/styles.xml中）：

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- 自定义主题属性 -->
</style>

完成以上步骤后，重新编译运行，BottomNavigationView即可显示正常的底部导航栏样式。

内容的提问来源于stack exchange，提问作者user30593854