Hector
Hector

Reputation: 5664

How to correctly display outlined icon in Android Bottom Navigation View

My current Android application employs com.google.android.material.bottomnavigation.BottomNavigationView

I have four icons, one of which is the standard android vector image for person outline

enter image description here

which looks like above

however in the Apps bottom navigation window it resembles the following:-

enter image description here

my xml layout for the navigation bar resembles this:-

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/home_bottom_navigation_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:itemTextColor="@color/bottom_navigation_bar_color"
    app:itemIconTint="@color/bottom_navigation_bar_color"
    android:layout_alignParentBottom="true"
    android:layout_marginStart="0dp"
    android:layout_marginEnd="0dp"
    android:background="?android:attr/windowBackground"
    app:labelVisibilityMode="unlabeled"
    app:menu="@menu/bottom_nav_menu" />

What have I done wrong to not have the outlined icon display correctly?

Upvotes: 1

Views: 1132

Answers (2)

Nouman Ch
Nouman Ch

Reputation: 4121

This worked for me:

bottomNavView.itemIconTintList = null

Upvotes: 1

xWarlord
xWarlord

Reputation: 23

With app:itemIconTint="@color/bottom_navigation_bar_color" you set the color to the icon. I think that this might solve your problem. See the docs: https://material.io/develop/android/components/bottom-navigation/

Upvotes: 0

Related Questions