如何更改物料抽屉中所选项目图标的颜色？

Question

I use the Mike Penze's Material Drawer library https://github.com/mikepenz/MaterialDrawer . On samples the icon color of selected item changes, but in my app doesn't. How to make color to change?

Answer 1

Sure, First you tint the different icons then in code, define the tinted ones as what shows when an item is highlighted.

The method is:

.withSelectedIcon()

and .withSelectedText() for text color

Answer 2

MaterialDrawer has a list of styles and colors that you can choose to change from their default values.

Add this to your styles.xml

<style name="CustomTheme" parent="MaterialDrawerTheme">
    <!-- ...and here we setting appcompat’s color theming attrs -->
    <item name="colorPrimary">@color/material_drawer_primary</item>
    <item name="colorPrimaryDark">@color/material_drawer_primary_dark</item>
    <item name="colorAccent">@color/material_drawer_accent</item>
    <!-- MaterialDrawer specific values -->
    <item name="material_drawer_background">@color/material_drawer_background</item>
    <item name="material_drawer_icons">@color/material_drawer_icons</item>
    <item name="material_drawer_primary_text">@color/material_drawer_primary_text</item>
    <item name="material_drawer_primary_icon">@color/material_drawer_primary_icon</item>
    <item name="material_drawer_secondary_text">@color/material_drawer_secondary_text</item>
    <item name="material_drawer_hint_text">@color/material_drawer_hint_text</item>
    <item name="material_drawer_divider">@color/material_drawer_divider</item>
    <item name="material_drawer_selected">@color/material_drawer_selected</item>
    <item name="material_drawer_selected_text">@color/material_drawer_selected_text</item>
    <item name="material_drawer_header_selection_text">@color/material_drawer_header_selection_text</item>
</style>

Add this to your colors.xml

    <!-- Material Drawer -->
<!-- Material DEFAULT colors -->
<color name="material_drawer_primary">@color/primary</color>
<color name="material_drawer_primary_dark">@color/primary_dark</color>
<color name="material_drawer_primary_light">@color/primary_light</color>
<color name="material_drawer_accent">@color/accent</color>
<!-- OVERWRITE THESE COLORS FOR A LIGHT THEME -->
<!-- MaterialDrawer DEFAULT colors -->
<color name="material_drawer_background">#F9F9F9</color>
<!-- Material DEFAULT text / items colors -->
<color name="material_drawer_icons">#FFF</color>
<color name="material_drawer_primary_text">#DE000000</color>
<color name="material_drawer_primary_icon">#8A000000</color>
<color name="material_drawer_secondary_text">#8A000000</color>
<color name="material_drawer_hint_text">#42000000</color>
<color name="material_drawer_divider">#1F000000</color>
<!-- Material DEFAULT drawer colors -->
<color name="material_drawer_selected">#E8E8E8</color>
<color name="material_drawer_selected_text">@color/primary</color>
<color name="material_drawer_header_selection_text">#FFF</color>
<!-- OVERWRITE THESE COLORS FOR A DARK THEME -->
<!-- MaterialDrawer DEFAULT DARK colors -->
<color name="material_drawer_dark_background">#303030</color>
<!-- MaterialDrawer DEFAULT DARK text / items colors -->
<color name="material_drawer_dark_icons">#000</color>
<color name="material_drawer_dark_primary_text">#DEFFFFFF</color>
<color name="material_drawer_dark_primary_icon">#8AFFFFFF</color>
<color name="material_drawer_dark_secondary_text">#8AFFFFFF</color>
<color name="material_drawer_dark_hint_text">#42FFFFFF</color>
<color name="material_drawer_dark_divider">#1FFFFFFF</color>
<!-- MaterialDrawer DEFAULT DARK drawer colors -->
<color name="material_drawer_dark_selected">#202020</color>
<color name="material_drawer_dark_selected_text">@color/material_drawer_primary</color>
<color name="material_drawer_dark_header_selection_text">#FFF</color>

If you do not declare some of these (you can delete any of the lines), then the library will just use the default values.

The color you are looking to change is the first one, "material_drawer_primary" which you can either relate to your own primary color, or simply place #ffffff where @color/primary is right now.

Don't forget to declare the library as a dependency in your app's build.gradle file.

compile ('com.mikepenz.materialdrawer:library:2.8.1@aar') {
    transitive = true
}

but change 2.8.1 to whatever version is the most recent.

Answer 3

There is no need to tint your icons manually. Just call the method:

.withIconTintingEnabled(true)

on each DrawerItem. Your app's primary colour will be used as the tint colour.