【问题标题】:BottomNavigationView display both icons and text labels at all timesBottomNavigationView 始终显示图标和文本标签
【发布时间】:2017-03-16 17:53:07
【问题描述】:

我正在使用设计支持库版本 25 中的 android.support.design.widget.BottomNavigationView

compile 'com.android.support:design:25.0.0'

<android.support.design.widget.BottomNavigationView
        android:id="@+id/bottomBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_gravity="center"
        app:itemBackground="@color/colorPrimary"
        app:menu="@menu/bottom_navigation_main"
        android:forceHasOverlappingRendering="true"/>

当@menu/bottom_navigation_main 中只有三个操作时,它始终显示图标和文本标签。

三个以上动作时,图标和文本标签一直显示的方式是什么?

【问题讨论】:

  • 在您的 bottom_navigation_main.xml 菜单中,如果您有 android:showAsAction="ifRoom" 将其更改为 android:showAsAction="always" 对于每个项目。
  • 'schemas.android.com/apk/res/android" xmlns:app="schemas.android.com/apk/res-auto"> '
  • 将 app:labelVisibilityMode="labeled" 放入 BottomNavigationView。
  • labelVisibilityMode 为我解决了问题!非常感谢!
  • 非常有用的问题。谢谢

标签: android android-support-library android-support-design bottomnavigationview


【解决方案1】:

对于仍在寻找解决方案并且不想依赖第三方库或运行时反射的任何人,支持库 28/Jetpack 中的 BottomNavigationView 原生支持始终具有文本标签。

This 是您正在寻找的方法。

或者在 XML 中,app:labelVisibilityMode="labeled"

【讨论】:

  • 我需要哪个库版本?
  • 支持库 28-alpha1+
  • 您还可以将可见性模式更改为“自动”,以便仅在按下/聚焦时显示图标文本。代码:app:labelVisibilityMode="auto"
  • 你就是男人!感谢您使用最新版本的材料库。
  • 太棒了。谢谢
【解决方案2】:

自 2018 年 5 月 8 日起更新

你可以使用 app:labelVisibilityMode="labeled" 直接在&lt;android.support.design.widget.BottomNavigationView /&gt;

来源:https://developer.android.com/reference/com/google/android/material/bottomnavigation/LabelVisibilityMode

下面冗长的解决方案不需要这个。

以前的答案

我对 BottomNavigationView 有一些奇怪的行为。当我选择其中的任何项目/片段时,片段将 BottomNavigationView 推低一点,因此 BottomNavigationView 的文本位于屏幕下方,因此只有图标可见,并且在单击任何项​​目时文本会隐藏。

如果您遇到这种奇怪的行为,那么这里就是解决方案。 只需删除

android:fitsSystemWindows="true"

在您的片段的根布局中。只需删除它并繁荣! BottomNavigationView 可以正常工作,现在可以用文本和图标显示。 我在 Fragment 的根 CoordinatorLayout 中有这个。

别忘了添加

BottomNavigationViewHelper.removeShiftMode(bottomNavigationView);

在您的活动中禁用变速模式。

这是那个类:

public class BottomNavigationViewHelper {

    @SuppressLint("RestrictedApi")
    public static void removeShiftMode(BottomNavigationView view) {
        //this will remove shift mode for bottom navigation view
        BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
        try {
            Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
            shiftingMode.setAccessible(true);
            shiftingMode.setBoolean(menuView, false);
            shiftingMode.setAccessible(false);
            for (int i = 0; i < menuView.getChildCount(); i++) {
                BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
                item.setShiftingMode(false);
                // set once again checked value, so view will be updated
                item.setChecked(item.getItemData().isChecked());
            }

        } catch (NoSuchFieldException e) {
            Log.e("ERROR NO SUCH FIELD", "Unable to get shift mode field");
        } catch (IllegalAccessException e) {
            Log.e("ERROR ILLEGAL ALG", "Unable to change value of shift mode");
        }
    }
}

【讨论】:

  • 这结合 STAR_ZERO 的回答解决了我的问题!
  • 在通话中你有disableShiftMode,在课堂上removeShiftMode。除了那个小小的差异之外,您的回答还为我解决了这个问题。我现在有五个菜单项,没有移动并且带有文本+图标。非常感谢非常
  • 完美。当您的底部导航中的项目超过 3 个时,就会出现移位模式。使用它,您可以禁用该转换,因此所有带有文本的图标都会同时出现。
  • 这是不受限制的 api,它不适用于支持库版本 28.+。接受@shaishgandhi 的答案是更合适的方法。
【解决方案3】:

在 25 版中很难。

试试这个代码。但我认为这不是一个好的解决方案。

BottomNavigationView navigationView = (BottomNavigationView) findViewById(R.id.bottomBar);
BottomNavigationMenuView menuView = (BottomNavigationMenuView) navigationView.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
    BottomNavigationItemView itemView = (BottomNavigationItemView) menuView.getChildAt(i);
    itemView.setShiftingMode(false);
    itemView.setChecked(false);
}

【讨论】:

  • 在 Android Studio 中,应该添加如下代码:``` //noinspection RestrictedApi itemView.setShiftingMode(false); //noinspection RestrictedApi itemView.setChecked(false); ```
  • 还是轮班项目
  • 完美!!显示图标和文本。但换档模式(假)不起作用。
  • 结合 KishanSolanki124 的回答解决了我的问题!
【解决方案4】:

您可以使用它在 BottomNevigationView 上显示文本和图标

app:labelVisibilityMode="labeled"

如果您使用它,您将能够查看图标和文本

<android.support.design.widget.BottomNavigationView
    app:labelVisibilityMode="labeled"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/bottom_navigation_view"
    android:layout_alignParentBottom="true"
    app:menu="@menu/bottom_navigation_menu"/>

【讨论】:

    【解决方案5】:

    这是一个结合了@STAR_ZERO 和@KishanSolanki124 的解决方案的Kotlin 扩展函数。

    fun BottomNavigationView.disableShiftMode() {
        val menuView = getChildAt(0) as BottomNavigationMenuView
    
        menuView.javaClass.getDeclaredField("mShiftingMode").apply {
            isAccessible = true
            setBoolean(menuView, false)
            isAccessible = false
        }
    
        @SuppressLint("RestrictedApi")
        for (i in 0 until menuView.childCount) {
            (menuView.getChildAt(i) as BottomNavigationItemView).apply {
                setShiftingMode(false)
                setChecked(false)
            }
        }
    }
    

    使用它:

    myBottomNavigation.disableShiftMode()
    

    【讨论】:

      【解决方案6】:

      你想要这个效果吗?

      如果是这样,我推荐你试试BottomNavigationViewEx

      【讨论】:

      • 你的库是好的和令人印象深刻的工作但我希望使用设计库 25.0.0 来实现这个功能不幸的是它违反了 android 设计实践
      • 这不违反 Material Design 规范,根据 the docs 中的“固定底部导航栏”。另外,我个人感谢分享这个很棒的图书馆。
      • 这违反了 Material Design 规范。如果您阅读您提供的文档,您会看到它明确表示“如果有四个或五个操作,则仅将非活动视图显示为图标”。
      【解决方案7】:

      你可以直接在里面使用app:labelVisibilityMode="labeled"

      <com.google.android.material.bottomnavigation.BottomNavigationView
              android:id="@+id/bottom_navigation"
              android:layout_width="match_parent"
              android:layout_height="50dp"
              app:labelVisibilityMode="labeled"
              android:elevation="8dp"
              android:layout_alignParentBottom="true"
              app:itemBackground="@drawable/bottom_navi"
              app:itemTextColor="@color/white"
              app:itemIconTint="@color/white"
              app:menu="@menu/bottom_nav_menu_managment" />
      

      【讨论】:

        【解决方案8】:

        在BottomNavigationView 类中有一个BottomNavigationMenuView 字段,在BottomNavigationMenuView 中有一个BottomNavigationItemView[] 字段,它是底部栏中的项目。

        说n是项目数,BottomNavigationMenuView会在BottomNavigationItemView[]数组的每个成员上调用BottomNavigationItemView.setShiftingMode(n>3)。此功能决定行为(始终或仅在选择时显示标题)。

        所以始终显示标题的方法是尝试调用此方法,您可以使用反射来访问私有字段。

            BottomNavigationView bottomNavigationView= (BottomNavigationView) findViewById(R.id.bottom_navigation);
        
        
        //  get the private BottomNavigationMenuView field 
                Field f = null;
                try {
                    f = bottomNavigationView.getClass().getDeclaredField("mMenuView");
                } catch (NoSuchFieldException e) {
                    e.printStackTrace();
                }
                f.setAccessible(true);
                BottomNavigationMenuView menuView=null;
                try {
                     menuView = (BottomNavigationMenuView) f.get(bottomNavigationView); 
                } catch (IllegalAccessException e) {
                    e.printStackTrace();
                }
        
        //  get the private BottomNavigationItemView[]  field 
                try {
                    f=menuView.getClass().getDeclaredField("mButtons");
                } catch (NoSuchFieldException e) {
                    e.printStackTrace();
                }
                f.setAccessible(true);
                BottomNavigationItemView[] mButtons=null;
                try {
                    mButtons = (BottomNavigationItemView[]) f.get(menuView); 
                } catch (IllegalAccessException e) {
                    e.printStackTrace();
                }
        
        
                for(int i=0;i<mButtons.length;i++){
                    mButtons[i].setShiftingMode(false);
                    mButtons[i].setChecked(true);
                }
        

        【讨论】:

        • 这很好,只是我们需要确保BottomNavigationMenuView也不会移动。 -> f = menuView.getClass().getDeclaredField("mShiftingMode"); f.setAccessible(true); f.setBoolean(menuView, false);
        【解决方案9】:

        一直显示标题。试试这个 Kotlin 代码:

        @SuppressLint("RestrictedApi")
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_ofree)
        
            navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener)
        
            val menuView = navigation.getChildAt(0) as BottomNavigationMenuView
            for (i in 0 until menuView.childCount) {
                val itemView = menuView.getChildAt(i) as BottomNavigationItemView
                itemView.setShiftingMode(false)
                itemView.setChecked(false)
            }
        }
        

        【讨论】:

          【解决方案10】:

          BottomNavigationViewEx 的替代方案: BottomBar

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2021-11-17
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多