Own custom icon not showing up in bottomnavigation bar android studio-CodePudding

I'm trying to make a bottomnavigation bar where the middle icon is my own icon which should be clickable and should fit in like this

In menu dir i made bottom_navigation.xml where lines responsible for the icon i want are :

<item
    android:id="@ id/park"
    android:icon="@drawable/ic_parkcenter"
    android:title="Park here"/>

In my maps_activity.xml (my main page where i want this shown) i use this :

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:layout_height="75dp"
            android:layout_gravity="bottom"
            android:layout_width="match_parent"
            android:id="@ id/bottom_nav"
            map:menu="@menu/bottom_navigation" />

and this is the result i get

I thought of putting it as imageview instead of item but sadly it doesnt work in menu. How should i proceed here? Thanks in advance!

CodePudding user response：

Just try this code of java in your activity or fragment:

    bottomNavigationView.setItemIconTintList(null) ;

Initialize it with your id when using the bottomNavigationView.

CodePudding user response：

There could be a better way to do this, But a hacky way of achieving something like this would be

<LinearLayout>
    <com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_height="75dp"
                android:layout_gravity="bottom"
                android:layout_width="wrap_content"
                android:id="@ id/bottom_nav_left"
                map:menu="@menu/bottom_navigation" />
    
        <LinearLayout
             android:layout_height="100dp"
             android:layout_width="match_parent"
             android:layout_gravity="bottom">
                <ImageView
                   android:layout_height="100dp"
                   android:layout_width="100dp"
                   src = ... />
                //Add textview or any other view. Otherwise remove linearlayout
       </LinearLayout>
    
       <com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_height="75dp"
                android:layout_gravity="bottom"
                android:layout_width="wrap_content"
                android:id="@ id/bottom_nav_right"
                map:menu="@menu/bottom_navigation" />
</LinearLayout>

This will give you additional flexibility while displaying image(Have the middle image larger without tint from the bottom nav). For bottom nav left populate with items with icons left of the image and same for the bottom nav right