How to increase the size of the icon in the navigation layout in Android?

I use the bottom layout navigation style in Android, which was recently introduced by Google in design library 25. In all the lessons and questions that I see, the images on their icons are of normal size, but mine are very small, despite the fact that the image that I save to a folder for drawing, it has a size of 72x72. Here is a screenshot:

enter image description here

Icons should be at least 2, maybe even 3 times more. How should I do it? Here is my code in my 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>

and in my 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" />

thank

+11
source share
6 answers

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>

.

+28

app:itemIconSize .

+8

Android Asset Studio, , , :

  • 24dp
  • 0dp

: , .

icon generator

drawable (mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi).

, 72x72 , , -.

zip , .

+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);
}

You can adjust the size of the images as you want. Happy coding

+3
source

override in dimensions. xml:

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

Add these two lines to the bottom navigation:

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

In dimens.xmladd:

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

To increase the size of the icons, increase bottom_navigation_icon_size. You may need to change the value design_bottom_navigation_heightso that the text does not overlap or you get too much design_bottom_navigation_heightspace.

0
source

Source: https://habr.com/ru/post/1674635/


All Articles