Changing BottomNavigationView's Icon Size

Question

I have been experimenting with the new BottomNavigationView and trying to customise it.

So far I have managed to change the height and margins by using the below:

<dimen name="design_bottom_navigation_height" tools:override="true">75dp</dimen>
<dimen name="design_bottom_navigation_margin" tools:override="true">5dp</dimen>

I want to increase the size of the icons.

How can this be done?

Compile Version: com.android.support:design:25.0.1

Answer 1

Late but Latest

Use implementation 'com.android.support:design:28.0.0' Design Support Library.

There is an property to change Icon Size:

<android.support.design.widget.BottomNavigationView
    app:itemIconSize="@dimen/_26sdp">
    ....
    ....
</android.support.design.widget.BottomNavigationView>

Programmatically:

dashboardNavigation.setItemIconSize(24);

UPDATE:

If you are using a material library then it will be the same. Just change the package name as below.

implementation 'com.google.android.material:material:1.1.0'

XML:

<com.google.android.material.bottomnavigation.BottomNavigationView
                app:itemIconSize="@dimen/_26sdp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

Programmatically - Same as above.

Thank you.

Answer 2

The icon size is hardcoded to 24dp in the item layout (see design_bottom_navigation_item.xml) and can be changed programmatically:

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, 32, displayMetrics);
    layoutParams.width = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, displayMetrics);
    iconView.setLayoutParams(layoutParams);
}