BottomNavigationView底部图标和文字的显示问题

一、BottomNavigationView3个以上图标不显示文字

当图标大于3个时,显示图标和当前页的文字。调用BottomNavigationView的setLabelVisibilityMode方法可以解决

布局设置:

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bnv_main"
        app:menu="@menu/bottom_nav_menu"
        app:itemIconTint="@color/color_state_menu_navi"
        app:itemTextColor="@color/color_state_menu_navi"
        app:labelVisibilityMode="labeled"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

</com.google.android.material.bottomnavigation.BottomNavigationView>

代码设置:

navView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_LABELED);

这个问题排查的时候,我都怀疑人生了,虽然解决了,但是做个记录吧,供大家参考

  • 6
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
要使 BottomNavigationView底部文字全部显示,可以使用以下方法: 1. 使用自定义布局:首先,创建一个自定义的布局文件,例如 `custom_bottom_navigation.xml`,在该布局文件中使用 TextView 来显示底部文字。设置 TextView 的属性,例如 `android:singleLine="true"` 和 `android:ellipsize="end"`,以确保文本不会换行,并且超出范围时以省略号显示。然后,将此自定义布局文件设置为 BottomNavigationView 的 item 布局。 示例代码如下所示: ```xml <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" app:itemLayout="@layout/custom_bottom_navigation" app:menu="@menu/bottom_navigation_menu" /> ``` 其中,`custom_bottom_navigation.xml` 文件的示例代码如下所示: ```xml <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/bottom_navigation_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:singleLine="true" android:ellipsize="end" android:textSize="12sp" /> ``` 2. 缩小字体大小:如果底部文字较长,可以尝试通过减小字体大小来适应显示。可以使用 `app:itemTextAppearanceActive` 和 `app:itemTextAppearanceInactive` 属性来设置活动和非活动状态下的字体大小。 示例代码如下所示: ```xml <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" app:itemTextAppearanceActive="@style/BottomNavigationActiveText" app:itemTextAppearanceInactive="@style/BottomNavigationInactiveText" app:menu="@menu/bottom_navigation_menu" /> ``` 然后,在 `styles.xml` 文件中定义字体样式: ```xml <style name="BottomNavigationActiveText"> <item name="android:textSize">12sp</item> </style> <style name="BottomNavigationInactiveText"> <item name="android:textSize">12sp</item> </style> ``` 通过调整字体大小,可以使底部文字适应 BottomNavigationView 的宽度,并全部显示出来。 这些方法可以帮助你在 BottomNavigationView显示全部底部文字。根据你的需求,选择适合的方法来解决问题
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值