【问题标题】:Bottom Navigation Overlapping TextView in Android TabletsAndroid 平板电脑中的底部导航重叠 TextView
【发布时间】:2021-07-05 16:45:00
【问题描述】:

我在我的应用程序中使用了BottomNavigationView,但是菜单项的文本重叠在小型设备的菜单图标上,如下图所示。

我试过这个:<dimen name="design_bottom_navigation_height" tools:override="true">56dp</dimen> 但在所有平板电脑中仍然存在重叠

我的 xml:

 <?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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">

    <FrameLayout
        android:id="@+id/fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="@dimen/_50sdp" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        style="@style/bottomnavigation"
        android:layout_width="match_parent"
        android:layout_height="@dimen/_60sdp"
        android:layout_gravity="bottom"
        android:background="@color/colorbottomnavigation"
        app:itemIconSize="@dimen/_20sdp"
        app:itemIconTint="@drawable/bottomsheetcolor"
        app:itemTextAppearanceActive="@style/BottomNavigationView.Active"
        app:itemTextAppearanceInactive="@style/BottomNavigationView"
        app:itemTextColor="@drawable/bottomsheetcolor"
        app:labelVisibilityMode="labeled"
        app:menu="@menu/bottom_navigation_menu" />

</FrameLayout>

这里是 menu.xml 文件:

<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:id="@+id/navigation_home"
    android:icon="@drawable/ic_home"
    android:title="HOME" />
<item
    android:id="@+id/navigation_prepwork"
    android:icon="@drawable/ic_edit"
    android:title="PREP WORK" />
<item
    android:id="@+id/navigation_timetable"
    android:icon="@drawable/ic_calendar"
    android:title="TIME TABLE" />
<item
    android:id="@+id/navigation_exam"
    android:icon="@drawable/ic_exambottom"
    android:title="ATTENDANCE" />
<item
    android:id="@+id/navigation_more"
    android:icon="@drawable/ic_more_24"
    android:title="MORE" />

【问题讨论】:

  • 您能添加您的菜单吗?我尝试使用您的代码,但它没有覆盖文本
  • 只需将BottomNavigationView 高度设置为wrap_content
  • @pratikvekariya 添加了
  • @javadroid 我试过但它不工作
  • 你能从导航菜单中删除样式并在框架布局上方设置与导航菜单中相同高度的边距

标签: android android-layout bottomnavigationview


【解决方案1】:

检查一下

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

<FrameLayout
    android:id="@+id/fragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/bottom_navigation"
    android:layout_marginBottom="@dimen/_60sdp" />

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:background="@color/colorPrimary"
    app:itemIconTint="@color/white"
    app:itemTextAppearanceActive="@color/white"
    app:itemTextAppearanceInactive="@android:color/background_dark"
    app:itemTextColor="@color/black"
    app:labelVisibilityMode="labeled"
    app:menu="@menu/bottom_navigation_menu" />

菜单

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/video"
        android:icon="@drawable/ic_video"
        android:title="Video" />


    <item
        android:id="@+id/app_not_working"
        android:icon="@drawable/ic_alert"
        android:title="Alert" />


    <item
        android:id="@+id/audio"
        android:icon="@drawable/ic_audio"
        android:title="audio" />


    <item
        android:id="@+id/chevron_left_black_36dp"
        android:icon="@drawable/ic_chevron_left_black_36dp"
        android:title="chevron_left_black_36dp" />


    <item
        android:id="@+id/delete_black"
        android:icon="@drawable/ic_delete_black"
        android:title="delete_black" />

</menu>

创建平板电脑变体

见截图

【讨论】:

  • 我已经提到平板电脑(800x1280 以上)不是小型设备......在小型设备中,它的工作正常感谢您的回答
  • @aartiLadva 我已经更新了我的答案,检查一下。创建平板电脑变体。签入平板电脑 1200x1920。如果不起作用,请告诉我。
  • 请给 app:itemIconSize="@dimen/_20sdp" 然后检查,因为我必须给图标大小以在平板电脑中看起来更大
  • 使用 itemIconSize _20sdp 它有点覆盖,您可以尝试更改 itemIconSize。我认为您需要为平板电脑布局设置更大的图标大小
  • 它看起来太小了
猜你喜欢
  • 1970-01-01
  • 2017-07-18
  • 2020-03-23
  • 2018-07-10
  • 2021-02-02
  • 2014-06-19
  • 1970-01-01
  • 2016-01-10
  • 1970-01-01
相关资源
最近更新 更多