如何在android底部导航布局中增加图标大小？

Question

我正在使用谷歌最近在设计库 25 中引入的 android 底部布局导航样式。在我看到的所有教程和问题中，他们图标中的图像都是正常大小，但我的图像非常小，尽管我保存到可绘制文件夹的图像是 72x72 的事实。截图如下：

图标的大小至少应为 2，甚至可能是该大小的 3 倍。我该怎么做？这是我在bottom_layout.xml 中的代码：

  <?xml version="1.0" encoding="utf-8"?>

 <menu xmlns:android="http://schemas.android.com/apk/res/android"

   xmlns:app="http://schemas.android.com/apk/res-auto">
  <item
    android:id="@+id/menu_home"
    android:title="test"
    android:icon="@drawable/tabbarglossary"
    app:showAsAction="always|withText"
    />
  <item
    android:id="@+id/menu_search"
    android:title="test2"
    android:icon="@drawable/mediationtabbar"
    app:showAsAction="always|withText"
    />

  <item
    android:id="@+id/menu_notifications"
    android:title="test3"
    android:icon="@drawable/ic_action_name"
    app:showAsAction="always|withText"
    />

</menu>

在我的 activity_main.xml 中：

 <android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:layout_marginBottom="0dp"
    android:layout_marginLeft="0dp"
    android:layout_marginRight="0dp"
    android:focusable="false"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    design:menu="@menu/bottom_layout" />

谢谢

Answer 1

将app:itemIconSize 属性设置为您的首选值。

Answer 2

图标大小在项目布局中被硬编码为 24dp（请参阅design_bottom_navigation_item.xml） 这可以通过编程方式更改：

BottomNavigationView bottomNavigationView = (BottomNavigationView) activity.findViewById(R.id.bottom_navigation_view);
BottomNavigationMenuView menuView = (BottomNavigationMenuView) bottomNavigationView.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
    final View iconView = menuView.getChildAt(i).findViewById(android.support.design.R.id.icon);
    final ViewGroup.LayoutParams layoutParams = iconView.getLayoutParams();
    final DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
    // set your height here
    layoutParams.height = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, displayMetrics);
    // set your width here
    layoutParams.width = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, displayMetrics);
    iconView.setLayoutParams(layoutParams);
}

编辑

对于图标覆盖文本的问题：

您可以覆盖底部导航视图的一些默认尺寸。例如高度。

<dimen name="design_bottom_navigation_height" tools:override="true">56dp</dimen>

查看guidelines bottom navigation 了解默认规格。

Answer 3

将这两行添加到您的底部导航：

app:menu="@menu/main_bottom_navigation"
app:itemIconSize="@dimen/bottom_navigation_icon_size"

在dimens.xml 添加：

<dimen name="bottom_navigation_icon_size" tools:override="true">32dp</dimen>
<dimen name="design_bottom_navigation_height" tools:override="true">72dp</dimen>

要增加图标的大小，请增加bottom_navigation_icon_size。您可能需要更改 design_bottom_navigation_height 的值，以使文本不会重叠，否则您会得到太多空白。

Answer 4

我会尝试为您使用Android Asset Studio 至generate an generic icon，确保：

• 图标大小为 24dp
• 它有 0dp 填充

注意：如果您愿意，可以使用自定义图标。

然后它将为您生成具有正确目录（mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi）的相应可绘制对象。

在您的情况下具有静态可绘制尺寸（例如 72x72）可能会根据手机的密度改变图标的​​大小，不同的手机会以不同的方式转换像素。

只需下载 zip 文件中的图标并将可绘制文件夹解压缩到您的资源目录，这应该可以解决您的问题。

Answer 5

这里：

BottomNavigationView bottomNavigationView = (BottomNavigationView) 
configurationActivity.findViewById(R.id.bottom_navigation_view);
BottomNavigationMenuView menuView = (BottomNavigationMenuView) 
bottomNavigationView.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
     final View iconView = 
menuView.getChildAt(i).findViewById(android.support.design.R.id.icon);
     final ViewGroup.LayoutParams layoutParams = 
iconView.getLayoutParams();
     final DisplayMetrics displayMetrics = 
getResources().getDisplayMetrics();
layoutParams.height = (int) 
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, 
displayMetrics);
layoutParams.width = (int) 
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, 
 displayMetrics);
iconView.setLayoutParams(layoutParams);
}

您可以根据需要调整图像的大小。 快乐编码

Answer 6

在dimens.xml 中覆盖：

<dimen name="design_bottom_navigation_icon_size" tools:override="true">'your size in dp'</dimen>

Answer 7

在 Kotlin 中

对于那些想要在 android-X 上尝试并希望唯一一项更改其大小的人，这是我修改了一点的代码来自 @Minkoo

 val bottomNavigationView:BottomNavigationView=findViewById(R.id.bottomNavigationView);
 val menuView: BottomNavigationMenuView = bottomNavigationView.getChildAt(0) as BottomNavigationMenuView
        
for (i in 0..menuView.getChildCount() - 1) {

            if (i == 2) {

                val iconView: View = menuView.getChildAt(i)
                    .findViewById(com.google.android.material.R.id.icon) as View
                val layoutParams: ViewGroup.LayoutParams = iconView.getLayoutParams();
                val displayMetrics: DisplayMetrics = getResources().getDisplayMetrics();
                // set your height here
                layoutParams.height =
                    TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 38f, displayMetrics)
                        .toInt()
                // set your width here
                layoutParams.width =
                    TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 38f, displayMetrics)
                        .toInt()
                iconView.setLayoutParams(layoutParams);
            }
        }