
Open res > values > colors.xml and add the following line for the new icon and text color for when an item is selected:ĥ.

Add a new Drawable Resource File in res > drawable with the name menu_background_color_state.xml and add the following lines to define the color states of item background color states:Ĥ.

Add a new Color Resource File in res > color (Create the color directory under res if you don’t have it already and make sure to name it exactly) with the name menu_item_color_state.xml and add the following lines to define the color states for the menu item’s icon and text:ģ.

Styling: itemIconTint, itemTextColor, itemBackground To read more about themes and styles, please go to these wonderful articles by Nick Butcher: The advantage of using styles is to unify the styles for each UI element so every time you add a new UI element (for instance, a Button or a TextView), you can call a style attribute to apply all the UI changes for that particular element you’ve applied in other places to be consistent with your style/brand throughout the app.The advantage of using ?attr/ in calling colors and color states is because of reasons like making it generic so it’s easy for us to either change our brand colors in the future, so adding a new theme for our app (for instance, to support Dark/Light mode).via attributes like ?attr/ and never on the UI component directly but through styles. In addition to styling, this tutorial also provides the best practices of using colors and resources, i.e. Here’s the recap of what we’ve achieved in the first part:Īnd if you follow along, by the end of the series, you’ll have a screen looking like this: Note
