Reputation: 17
Is it possible to change bottom navigation view color tint to a custom color created using xml? If so how do I do this? I am aware that you can change the icon color tint with the property "app:itemIconTint="@color/colorPrimaryDark", but I am not sure how to go about referencing the color in my drawable for the iconTint color.
Bottom navigation view
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.examp.smartshop.Controller.MainActivity">
<FrameLayout
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@id/bottom_navigation">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemIconTint="@color/colorPrimaryDark"
app:itemTextColor="@color/colorPrimaryDark"
app:menu="@menu/bottom_navigation"
app:itemIconSize="25sp"
android:background="?android:attr/windowBackground"/>
</RelativeLayout>
**Custom color**
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<gradient
android:angle="90"
android:endColor="#EC6EAD"
android:startColor="#3494E6"
android:type="linear" />
<corners
android:radius="0dp"/>
</shape>
Upvotes: 0
Views: 1078
Reputation:
Android BottomNavigationView
To disable this behaviour
bottomNavigationView.itemIconTintList = null
Change Icon and Selected Icon, from luasoftware.com:
Navigation Item (including text and icon) is specified in a menu file.
<com.google.android.material.bottomnavigation.BottomNavigationView ... app:menu="@menu/navigation" /> <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/navigation_dailyquote" android:icon="@drawable/yy_dailyquote" android:title="@string/navigation_dailyquote"/> ... </menu>
To support both icon and selected icon, create res/drawable/yy_dailyquote.xml.
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/yy_dailyquote_sun" android:state_checked="false"/> <item android:drawable="@drawable/yy_dailyquote_sun_active" android:state_checked="true"/> </selector>
TextColor and selected TextColor
Change TextColor
<com.google.android.material.bottomnavigation.BottomNavigationView
...
app:itemTextColor="#998971"
/>
Support TextColor and Selected TextColor
<com.google.android.material.bottomnavigation.BottomNavigationView
...
app:itemTextColor="@color/navigation_text_color"
/>
Create res/color/navigation_text_color.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#9A8971" />
<item android:state_checked="false" android:color="#AD9F88"/>
</selector>
Change Background Color
<com.google.android.material.bottomnavigation.BottomNavigationView
...
android:background="#FDFAE6"
/>
Upvotes: 4