I have used images as icon but I dont want them to look grey when they are not selected. It should look same as picture whether its active or not. What should I do?
com.google.android.material.bottomnavigation.BottomNavigationView
Thanks
Try using this in your XML file in the BottomNavigationView part
app:itemIconTint="null"
Or add this to your java file after defining your BottomNavigationView (with the findViewById)
//Replace BottomNavView with your nav bar id
BottomNavView.setItemIconTintList(null);
A long way to achieve it
mBottomNav.setItemIconTintList(null);
Then do the designs yourself. Don't forget to separate the buttons as clicked and not clicked.
Example Button XML
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--Clicked-->
<item android:drawable="#drawable/homeclicked" android:state_checked="true" />
<!--Not Clicked-->
<item android:drawable="#drawable/homenotclicked" android:state_checked="false" />
</selector>
And add them to the view: Example bottom_navigation.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/homebuttons"
android:icon="#drawable/homebuttonxml />
<!--Other Buttons...-->
</menu>
And finally, Link view to bottomnavigationview
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:labelVisibilityMode="unlabeled"
app:elevation="0dp"
app:menu="#menu/bottom_navigation">
</com.google.android.material.bottomnavigation.BottomNavigationView>
The default color used by not selected items is based on the colorOnSurface color.
Just use:
<com.google.android.material.bottomnavigation.BottomNavigationView
android:theme="#style/BottomNavigationViewThemeOverlay"
.... />
with:
<style name="BottomNavigationViewThemeOverlay">
<item name="colorOnSurface">#color/...</item>
</style>
Otherwise you can define your custom selector:
<com.google.android.material.bottomnavigation.BottomNavigationView
app:itemIconTint="#color/bottomnavicontint"
../>
with:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="1.0" android:color="?attr/colorPrimary" android:state_checked="true"/>
<item android:alpha="0.6" android:color="#color/..."/>. <!-- not selected -->
</selector>
Related
How to change menu item text color in xml file
in drawable file the code looks like this file name: bottom_nav_menu_item_text_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color= "#color/bottom_nav_menu_item_selected_color"
android:state_checked="true"
android:state_selected="true"/>
<item
android:color= "#color/bottom_nav_menu_item_unselected_color"
/>
</selector>
Bottom Navigation Menu Bar looks like this in activity_main.xml
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/bottom_nav_menu_bar"
app:menu="#menu/bottom_nav_menu_items"
app:itemTextColor="#drawable/bottom_nav_menu_item_text_color"
android:background="#color/white"
/>
Can add more info with SS or gif about current behaviour so exact solution can be provided
But as you asked question about changing color of BottomNavigationView text change then you can use as mentioned below
tab_text_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="false" android:color="#color/unselectedTab" />
<item android:state_selected="true" android:color="#color/selectedTab" />
<item android:color="#color/unselectedTab" />
</selector>
In Activity xml
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/bottom_nav_menu_bar"
app:menu="#menu/bottom_nav_menu_items"
app:itemTextColor="#drawable/tab_text_selector"
android:background="#color/white"
/>
I have a bottomnavigation view that sets an icon depending on the state if it's checked or not.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/icon_tree"
android:title="Tree"
android:icon="#drawable/bottomnav_icon_home">
</item>
</menu>
bottomnav_icon_home:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/icon_home_black" android:state_checked="false"/>
<item android:drawable="#drawable/icon_home_green" android:state_checked="true"/>
</selector>
How ever bottomnavigation is automatically highlighting the icon when android:state_checked is true.
How do I completely disable bottomnavigation's icon selection highlight?
I've tried setting app:itemIconTint="#drawable/bottom_navigation_selector" to #null however that doesn't work
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:menu="#menu/bottom_navigation_menu"
android:background="#color/colorWhite"
app:itemTextColor="#drawable/bottom_navigation_selector"
app:itemIconSize="28dp"
app:itemIconTint="#drawable/bottom_navigation_selector"
app:labelVisibilityMode="labeled"/>
bottom_navigation_selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
android:color="#color/forestGreen" />
<item android:color="#color/colorBlack" />
</selector>
If i understood you right, android by default sets a tint on your bottom navigation icons on selection and you would like it to be removed right.
I know how to do that in your java class not xml though.
You'll need to set setItemIconTintList method of your BottomNavigationView to null. So in wherever you set the layout write code as :
BottomNavigationView btmNav = findViewById(R.id.bottom_navigation);
btmNav.setItemIconTintList(null);
Let us know if this works for you.
try to add this line in the dimens.xml
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">#dimen/design_bottom_navigation_text_size</dimen>
You can create custom style.
There are two steps.
1- Create custom bottom_navigation_bar_icon_color.xml in drawable folder. This is the selector showed the icon highlighted or default. So you can highlight all icons or show them as default. Choose one of the following when creating your bottom_navigation_bar_icon_color.xml
Icons highlighted: <item android:alpha="1.0" android:color="?attr/colorOnPrimary" android:state_checked="true"/>
Icons default: <item android:alpha="0.6" android:color="?attr/colorOnPrimary"/>
bottom_navigation_bar_icon_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="0.6" android:color="?attr/colorOnPrimary"/>
</selector>
2- Add following custom style to themes.xml or styles.xml. bottom_navigation_bar_icon_color used in itemIconTint and itemTextColor
<style name="BottomNavigationThemeCustom">
<item name="enforceTextAppearance">true</item>
<item name="enforceMaterialTheme">true</item>
<item name="android:background">?attr/colorPrimary</item>
<item name="itemIconTint">#drawable/bottom_navigation_bar_icon_color</item>
<item name="itemRippleColor">#color/mtrl_navigation_bar_colored_ripple_color</item>
<item name="itemTextAppearanceInactive">?attr/textAppearanceCaption</item>
<item name="itemTextAppearanceActive">?attr/textAppearanceCaption</item>
<item name="itemTextColor">#drawable/bottom_navigation_bar_icon_color</item>
</style>
3- Use your new style for bottomNavigationBar
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigation"
style="#style/BottomNavigationThemeCustom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
app:labelVisibilityMode="unlabeled"
app:menu="#menu/bottom_menu" />
4- If you want to hide the bottomNavigationBar on Scroll add following attribute to bottomNavigationBar
app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior"
You consider create your own implementation of bottomNavigation?
When I implement the Google BottomNavigationView, I got a lot of issues, so I create a new one like this:
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true">
<View android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/grayBottomNavigationDelimiter"/>
<RadioGroup android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorNavigationBar"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatRadioButton
android:id="#+id/homeButton"
android:drawableTop="#drawable/ic_home_black_24dp"
android:text="#string/navigation_home_text"
style="#style/RadioButtonStyle"/>
...
So, can see this is easier than imagine, did you?
To add it through XML: For the attribute IconItemTint and ItemTextColor, simply use the same color that you've used for icons by default. In that case, the highlight color and default color will be the same. Will give you the required ripple effect on selecting but highlight wont be visible.
For my black color icon, I've used this:
app:itemIconTint="#color/black"
app:itemTextColor="#000000"
My entire bottom nav looks like this:
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
app:itemIconTint="#color/black"
app:itemTextColor="#000000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/bottom_nav_more_options_menu" />
I have a BottomNavigationView and want to have custom icons for both selected and unselected state.Tried using selector but its not working.
Any idea how to place custom icons ?
Edit - Adding code from comments into the Question
<item
android:id="#+id/navigation_card"
android:icon="#drawable/iv_home_card"
app:itemBackground="#drawable/navigation_card"
app:showAsAction="ifRoom" tools:ignore="MenuTitle"
/>
Like this I have added the icon. Now for selected state, it stroke it with theme color but I want to replace the icon with another icon.
I tried making selector but did not work
<selector
xmlns:android="schemas.android.com/apk/res/android">
<item android:state_checked="false"
android:drawable="#drawable/btn_star_off_normal" />
<item android:state_checked="true"
android:drawable="#drawable/btn_star_on_normal" />
</selector>
BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener = new BottomNavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
switch (item.getItemId()) { }
return false;
}
};
You can simply create drawable selector in drawable folder and image can be change according to the state of the widget used in view
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/home_active" android:state_checked="true"/>
<item android:drawable="#drawable/home_inactive" android:state_checked="false"/>
and set this selector in bottom nav menu file
<item
android:id="#+id/navigation_home"
android:icon="#drawable/nav_home_selector"
android:title="#string/tab_home_title" />
Make sure to add this line to your java file. This solution will not work for selected icon unless you add this line.
bottomNavigationView.setItemIconTintList(null);
This will disable tint effect of selected item icon.
BottomNavigationView will get its icons from the menu file so you cannot set them from your selector drawable. However, if you want to change their color for selected and not selected states you can do this as below.
Create your selector drawable nav_item_color_state as below
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/white" android:state_enabled="true" />
<item android:color="#color/colorPrimary" android:state_enabled="false" />
</selector>
set itemIconTint and itemTextColor using selector drawable as below and it will change color of your icon and text when selected.
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemIconTint="#drawable/nav_item_color_state"
app:itemTextColor="#drawable/nav_item_color_state"
app:menu="#menu/bottom_navigation_main" />
Check documentation from here
for some reason, "state_enabled" wasn't working in my case so I used the below-given selector.
nav_color_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/black" android:state_checked="true" />
<item android:color="#color/grey" android:state_checked="false" />
</selector>
Along with BottomNavigationView as
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
app:itemIconTint="#drawable/nav_color_selector"
app:itemTextColor="#drawable/nav_color_selector"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
This code changed the filled color of vector drawables which I linked in the bottom_nav_menu.xml
I refer this. Schedules Activity is appeared when I click Schedules, but first item color (Favorites) is always selected. It doesn't change Schedules item color from Favorites item color. And also, third item (Music). I use android:state_checked NOT android:state_enabled." If working with startActivity, it doesn't change Schedules item color from Favorites item color. If not, it change color. How to solve this color select problems.
activity_main.xml
app:itemIconTint="#drawable/nav_item_color_state"
app:itemTextColor="#drawable/nav_item_color_state"
app:menu="#menu/bottom_navigation_main"
#drawable/nav_item_color_state
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/white" android:state_enabled="true" />
<item android:color="#color/colorPrimaryDark" android:state_enabled="false" />
</selector>
create a color directory in res folder and create your xml file for customize your bottom navigation items:
res/color/bottom_nav_color.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#color/your_color" />
<item android:state_checked="false" android:color="#color/your_color"/>
</selector>
and in your BottomNavigationView set app:itemTextColor and app:itemIconTint values to #color/bottom_nav_color
<android.support.design.widget.BottomNavigationView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/actionBarColor"
app:menu="#menu/my_navigation_items"
app:itemTextColor="#color/bottom_nav_color"
app:itemIconTint="#color/bottom_nav_color"/>
Make a xml file in the drawable folder with the name of navigation_view_colored.xml and put this inside:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:color="#color/gray" />
<item android:state_checked="true" android:color="#color/blue" />
</selector>
Add the xml you created to app:itemIconTint
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/bottom_navigation"
android:layout_alignParentBottom="true"
app:itemIconTint="#drawable/navigation_view_colored"
app:itemTextColor="#color/blue"
app:menu="#menu/bottom_navigation"
android:background="?android:attr/windowBackground"/>
just change theme:
create themes.xml in values and add this style
<style name="BottomNavThem" parent="Theme.MaterialComponents.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimaryRed</item>
</style>
and set to BottomNavigationView
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/main_navigation_menu"
android:theme="#style/BottomNavThem"/>
here is simple solution to your question
<android.support.design.widget.TabLayout
....
app:tabBackground="#drawable/tab_color_selector"
...
/>
the selector res/drawable/tab_color_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/tab_background_selected" android:state_selected="true"/>
<item android:drawable="#color/tab_background_unselected" android:state_checked="false"/>
</selector>
update tab item selector color what your required to.
In my situation, I used BottomNavigationBarEx plugin. So, I had to do it like below:
In my res/layout/layout_navigation_view.xml:
Added app:itemIconTint="#drawable/bottom_nav_colors". Since, I only used icons. So if you have text add this: app:itemTextColor="#drawable/bottom_nav_colors" also.
<com.ittianyu.bottomnavigationviewex.BottomNavigationViewEx
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/bottomNavBar"
android:background="#drawable/white_grey_border_top"
app:itemIconTint="#drawable/bottom_nav_colors"
app:menu="#menu/bottom_navigation_menu" />
Then in res/drawable directory (because selectors need to include in drawable or animatable directory) add the selector(as others mentioned):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:color="#color/grey" />
<item android:state_checked="true" android:color="#color/blue" />
</selector>
Then in res/values/colors.xml add your select and unselect colors, as ex:
<color name="grey">#bfbfbf</color>
<color name="blue">#3F51B5</color>
Have you heard about the wrapper project called BottomBar of Roughike which makes the use of BottomNavigationView easier? Project can be found here.
I suggest you to use this project which is up to date and has contribution in a high level. If you refer to use this, You can simply insert the below code to change the colors when clicked on tabs and do much more customized stuff:
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout);
Tab tab = newTab().setIcon(new BitmapDrawable(getResources(), icon)));
tab.getIcon().setColorFilter(Color.parseColor("#7E7E7E"), PorterDuff.Mode.SRC_IN);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
#Override public void onTabSelected(TabLayout.Tab tab) {
if (tab != null && tab.getIcon() != null) {
tab.getIcon().clearColorFilter();
}
}
#Override public void onTabUnselected(TabLayout.Tab tab) {
if (tab != null && tab.getIcon() != null) {
tab.getIcon()
.setColorFilter(Color.parseColor("#7E7E7E"),
PorterDuff.Mode.SRC_IN);
}
}
#Override public void onTabReselected(TabLayout.Tab tab) {
}
});
}
}
});
So basically what I do here, I color unselected tabs to #7E7E7E and clear the filter for coloring from selected ones so they appear with their original color of their icon. Of course, you can fill with another color when selected as well, that's up to you.
Hope this helps you!
Cheers,
Renc
Other answers using the drawable selector didn't work for me.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#color/colorPrimary" />
<item android:color="#color/bottomnavUnselectedColor" />
</selector>
This worked in my case removing the state_checked="false"
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomnav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/transparent_rect"
app:layout_constraintBottom_toBottomOf="parent"
app:itemIconTint="#drawable/bottomnav_selector"
app:menu="#menu/bottomnav_menu"/>
I'm adding a BottomNavigationView to a project, and I would like to have a different text (and icon tint) color for the selected tab (to achieve greying out non-selected tabs effect). Using a different color with android:state_selected="true" in a color selector resource file doesn't seem to work. I also tried having additional item entries with android:state_focused="true" or android:state_enabled="true", no effect unfortunately. Also tried setting the state_selected attribute to false (explicitly) for the default (non-selected) color, with no luck.
Here is how I add the view to my layout:
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemBackground="#color/silver"
app:itemIconTint="#color/bnv_tab_item_foreground"
app:itemTextColor="#color/bnv_tab_item_foreground"
app:menu="#menu/bottom_nav_bar_menu" />
Here is my color selector (bnv_tab_item_foreground.xml):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#android:color/darker_gray" />
<item android:state_selected="true" android:color="#android:color/holo_blue_dark" />
</selector>
And my menu resource (bottom_nav_bar_menu.xml):
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/action_home"
android:icon="#drawable/ic_local_taxi_black_24dp"
android:title="#string/home" />
<item
android:id="#+id/action_rides"
android:icon="#drawable/ic_local_airport_black_24dp"
android:title="#string/rides"/>
<item
android:id="#+id/action_cafes"
android:icon="#drawable/ic_local_cafe_black_24dp"
android:title="#string/cafes"/>
<item
android:id="#+id/action_hotels"
android:icon="#drawable/ic_local_hotel_black_24dp"
android:title="#string/hotels"/>
</menu>
I would appreciate any help.
While making a selector, always keep the default state at the end, otherwise only default state would be used. You need to reorder the items in your selector as:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#android:color/holo_blue_dark" />
<item android:color="#android:color/darker_gray" />
</selector>
And the state to be used with BottomNavigationBar is state_checked not state_selected.
1. Inside res create folder with name color (like drawable)
2. Right click on color folder. Select
new-> color resource file-> create color.xml file (bnv_tab_item_foreground)
(Figure 1: File Structure)
3. Copy and paste bnv_tab_item_foreground
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
app:itemBackground="#color/appcolor"//diffrent color
app:itemIconTint="#color/bnv_tab_item_foreground" //inside folder 2 diff colors
app:itemTextColor="#color/bnv_tab_item_foreground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/navigation" />
bnv_tab_item_foreground:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#color/white" />
<item android:color="#android:color/darker_gray" />
</selector>
Figure 1: File Structure:
BottomNavigationView uses colorPrimary from the theme applied for the selected tab and it uses android:textColorSecondary for the inactive tab icon tint.
So you can create a style with the prefered primary color and set it as a theme to your BottomNavigationView in an xml layout file.
styles.xml:
<style name="BottomNavigationTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/active_tab_color</item>
<item name="android:textColorSecondary">#color/inactive_tab_color</item>
</style>
your_layout.xml:
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
android:theme="#style/BottomNavigationTheme"
app:menu="#menu/navigation" />
If you want to change icon and text colors programmatically:
ColorStateList iconColorStates = new ColorStateList(
new int[][]{
new int[]{-android.R.attr.state_checked},
new int[]{android.R.attr.state_checked}
},
new int[]{
Color.parseColor("#123456"),
Color.parseColor("#654321")
});
navigation.setItemIconTintList(iconColorStates);
navigation.setItemTextColor(iconColorStates);
I am using a com.google.android.material.bottomnavigation.BottomNavigationView (not the same as OP's) and I tried a variety of the suggested solutions above, but the only thing that worked was setting app:itemBackground and app:itemIconTint to my selector color worked for me.
<com.google.android.material.bottomnavigation.BottomNavigationView
style="#style/BottomNavigationView"
android:foreground="?attr/selectableItemBackground"
android:theme="#style/BottomNavigationView"
app:itemBackground="#color/tab_color"
app:itemIconTint="#color/tab_color"
app:itemTextColor="#color/bottom_navigation_text_color"
app:labelVisibilityMode="labeled"
app:menu="#menu/bottom_navigation" />
My color/tab_color.xml uses android:state_checked
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/grassSelected" android:state_checked="true" />
<item android:color="#color/grassBackground" />
</selector>
and I am also using a selected state color for color/bottom_navigation_text_color.xml
Not totally relevant here but for full transparency, my BottomNavigationView style is as follows:
<style name="BottomNavigationView" parent="Widget.Design.BottomNavigationView">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">#dimen/bottom_navigation_height</item>
<item name="android:layout_gravity">bottom</item>
<item name="android:textSize">#dimen/bottom_navigation_text_size</item>
</style>
It's too late to answer but might be helpful for someone.
I was doing a very silly mistake, I was using a selector file named as bottom_color_nav.xml for Select and unselect color change but still it was not reflecting any color change in BottomNavigationView.
Then I realize, I was returning false in onNavigationItemSelected method. It will work fine if you'll return true in this method.
In order to set textColor, BottomNavigationView has two style properties you can set directly from the xml:
itemTextAppearanceActive
itemTextAppearanceInactive
In your layout.xml file:
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bnvMainNavigation"
style="#style/NavigationView"/>
In your styles.xml file:
<style name="NavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
<item name="itemTextAppearanceActive">#style/ActiveText</item>
<item name="itemTextAppearanceInactive">#style/InactiveText</item>
</style>
<style name="ActiveText">
<item name="android:textColor">#color/colorPrimary</item>
</style>
<style name="InactiveText">
<item name="android:textColor">#color/colorBaseBlack</item>
</style>
Try using android:state_enabled rather than android:state_selected for the selector item attributes.
This will work:
setItemBackgroundResource(android.R.color.holo_red_light)
Instead of creating selector,
Best way to create a style.
<style name="AppTheme.BottomBar">
<item name="colorPrimary">#color/colorAccent</item>
</style>
and to change the text size, selected or non selected.
<dimen name="design_bottom_navigation_text_size" tools:override="true">11sp</dimen>
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>
Enjoy Android!
As the folder structure has changed, the tab_color.xml belongs to res > drawable now which can handle selectors. From there on the accepted solution works.