更改导航抽屉菜单项的文本颜色

101

我想为我的应用程序添加夜间主题,但我已经浪费了将近三个小时,只是试图使我的导航抽屉中的文本和图标与黑暗背景一起变白。这是我在MainActivity.java中的onCreate()方法中尝试实现这一点的方式:

navigationView = (NavigationView) findViewById(R.id.navigation_view);
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {

    // This method will trigger onItemClick of navigation menu
    @Override
    public boolean onNavigationItemSelected(MenuItem menuItem) {

        // Checking if the item is in checked state or not, if not make it in checked state
        if (menuItem.isChecked())
            menuItem.setChecked(false);
        else menuItem.setChecked(true);

        if (nightMode == 0) {
            SpannableString spanString = new SpannableString(menuItem.getTitle().toString());
            spanString.setSpan(new ForegroundColorSpan(Color.WHITE), 0, spanString.length(), 0); // fix the color to white
            menuItem.setTitle(spanString);
        }

nightMode 布尔值并不重要,因为它是有效的。当夜间模式设置为打开(0)时,导航抽屉中选择的菜单项会变为白色。然而,这仅在选择每个项目时发生,显然很不方便。以下是我的 drawer_dark.xml 文件:

    <?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group
        android:checkableBehavior="single">
        <item
            android:id="@+id/unitone"
            android:checked="true"
            android:icon="@drawable/one_white"
            android:title="Classical Period" />
        <item
            android:id="@+id/unittwo"
            android:checked="false"
            android:icon="@drawable/two_white"
            android:title="Postclassical Period" />
        <item
            android:id="@+id/unitthree"
            android:checked="false"
            android:icon="@drawable/three_white"
            android:title="Early Modern Era" />
        <item
            android:id="@+id/unitfour"
            android:checked="false"
            android:icon="@drawable/four_white"
            android:title="Dawn of Industrial Age" />
        <item
            android:id="@+id/unitfive"
            android:checked="false"
            android:icon="@drawable/five_white"
            android:title="Modern Era" />
    </group>
</menu>

我为每个项目使用透明背景上的白色图标,但是它们在导航抽屉的黑色背景上显示为黑色。我已经尝试查找通过xml更改文本颜色的解决方案,但我被困惑了,因为我不知道为什么会忽略这个问题。

有人能够提供一个动态解决方案来实现我的目标吗? 感谢所有帮助!

编辑:我没有使用第三方库,而是使用支持库中提供的NavigationView。以下是XML布局:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:elevation="7dp"
    tools:context=".MainActivity"
    android:fitsSystemWindows="true" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/ColorDark" />

        <include layout="@layout/toolbar" />

    </FrameLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:background="#000"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/header"
        app:menu="@menu/drawer" />

</android.support.v4.widget.DrawerLayout>

为什么不直接将Activity主题从“Light”更改为“Dark”,反之亦然? - Emil
@老板,按照我的应用程序编程方式,这将是一个繁琐的过程。我已经在其他所有地方完美地实现了白天/黑夜主题,但是我的导航抽屉中还存在问题,所以我只需要解决这个问题。 - wasimsandhu
18个回答

278
 <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:background="#000"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/header"
        app:itemTextColor="your color"
        app:menu="@menu/drawer" />

32
这将会把导航抽屉中所有项目的颜色设置为“你的颜色”。是否有一种方法可以单独为每个抽屉分组更改颜色? - Akeshwar Jha
2
@Akeshwar,你可以尝试以编程方式实现,但我不建议这样做,因为它违反了Material指南。 - Abdellah Benhammou
2
@NehaTyagi 如何从XML中更改菜单项的字体样式。 - Chetan Joshi
@anjujo,是的。只需删除此行 -“app:itemTextColor”。现在永远不会太晚 :) - Dmitriy Greh
我因不同原因进入了这个答案:我之前确实做过这个(itemTextColor)。现在我进行了重构并将其移动到样式中,但它没有起作用!(文本再次变为黑色,就像根本没有设置一样!)其他属性对于 <style> 已经起作用了(例如背景颜色),但itemTextColor没有起作用!...我不明白...好像在 <style> 标签中没有 app:* 的东西是有效的? - SebasSBM
显示剩余2条评论

50

在您的NavigationView中使用app:itemIconTint,例如:

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:itemTextColor="@color/customColor"
    app:itemIconTint="@color/customColor"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header_home"
    app:menu="@menu/activity_home_drawer" />

4
选中项目的文本颜色怎么办? - Usman Rana

28

NavigationView 有一个名为 setItemTextColor() 的方法,它使用了一个 ColorStateList.

// FOR NAVIGATION VIEW ITEM TEXT COLOR
int[][] state = new int[][] {
        new int[] {-android.R.attr.state_enabled}, // disabled
        new int[] {android.R.attr.state_enabled}, // enabled
        new int[] {-android.R.attr.state_checked}, // unchecked
        new int[] { android.R.attr.state_pressed}  // pressed

};

int[] color = new int[] {
        Color.WHITE,
        Color.WHITE,
        Color.WHITE,
        Color.WHITE
};

ColorStateList csl = new ColorStateList(state, color);


// FOR NAVIGATION VIEW ITEM ICON COLOR
int[][] states = new int[][] {
        new int[] {-android.R.attr.state_enabled}, // disabled
        new int[] {android.R.attr.state_enabled}, // enabled
        new int[] {-android.R.attr.state_checked}, // unchecked
        new int[] { android.R.attr.state_pressed}  // pressed

};

int[] colors = new int[] {
        Color.WHITE,
        Color.WHITE,
        Color.WHITE,
        Color.WHITE
};

ColorStateList csl2 = new ColorStateList(states, colors);

这里是我得到答案的地方。然后在分配我的NavigationView之后:

if (nightMode == 0) {
            navigationView.setItemTextColor(csl);
            navigationView.setItemIconTintList(csl2);
        }

你好,有没有办法单独更改导航抽屉中每个组的颜色? - Akeshwar Jha
仍然是灰色的。 - user3600801
如何更改群组文本颜色? - Ari

15

更多选项:

通过覆盖 "textColorSecondary",您还可以更改群组标题。

在您的 styles.xml 文件中进行修改。

<style name="AppTheme.NavigationView">
    <item name="android:textColorSecondary">#FFFFFF</item>
</style>

在您的布局中

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:menu="@menu/activity_main_menu_drawer_drawer"
    android:theme="@style/AppTheme.NavigationView"
    app:itemIconTint="@color/colorPrimary"
    app:itemTextColor="@color/white"/>

这个解决方案帮助我修复了颜色问题。谢谢! - Mark Delphi

11

像这样在你的NavigationView中添加app:itemTextColor="#fff"

 <android.support.design.widget.NavigationView
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    app:menu="@menu/slider_menu"
    android:background="@color/colorAccent"
    app:itemTextColor="#fff"
    android:id="@+id/navigation_view"
    android:layout_gravity="start"/>

6
我在我的应用程序中使用以下代码来更改导航抽屉文本颜色。
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setItemTextColor(ColorStateList.valueOf(Color.WHITE));

6

改变导航抽屉的文本颜色

我们使用app:itemTextColor="@color/white"

改变导航抽屉的图标颜色

使用app:itemIconTint="@color/black"


    <com.google.android.material.navigation.NavigationView
        android:id="@+id/naView"
        app:itemIconTint="@color/black"
        android:layout_width="match_parent"
        app:menu="@menu/navmenu"
        app:itemTextColor="@color/white"
        app:headerLayout="@layout/nav_header"
        android:layout_height="match_parent"
        app:itemTextAppearance="?android:textAppearanceMedium"
        android:fitsSystemWindows="true"
        android:layout_gravity="start"
        />


5

您可以在以下位置使用drawable:

app:itemTextColor app:itemIconTint

然后,您可以使用drawable来控制选中状态和正常状态。

<android.support.design.widget.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:itemHorizontalPadding="@dimen/margin_30"
            app:itemIconTint="@drawable/drawer_item_color"
            app:itemTextColor="@drawable/drawer_item_color"
            android:theme="@style/NavigationView"
            app:headerLayout="@layout/nav_header"
            app:menu="@menu/drawer_menu">

drawer_item_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/selectedColor" android:state_checked="true" />
    <item android:color="@color/normalColor" />
</selector>

4
您可以通过将主题添加到导航视图中来简单地完成此操作。
    <android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    android:background="@color/colorPrimary"
    android:theme="@style/AppTheme.NavigationView"
    app:headerLayout="@layout/nav_header_drawer"
    app:menu="@menu/activity_drawer_drawer"/>

在您的style.xml文件中,您将添加此主题。
   <style name="AppTheme.NavigationView" >
    <item name="colorPrimary">@color/text_color_changed_onClick</item>
    <item name="android:textColorPrimary">@color/Your_default_text_color</item>
</style>

4

这对我有效。在customTheme的位置上,您可以将您的主题放在样式中。 在此代码中,您还可以更改字体和文本大小。

    <style name="MyTheme.NavMenu" parent="CustomTheme">
            <item name="android:textSize">16sp</item>
            <item name="android:fontFamily">@font/ssp_semi_bold</item>
            <item name="android:textColorPrimary">@color/yourcolor</item>
        </style>

这是我的导航视图。
<android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:theme="@style/MyTheme.NavMenu"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer">

        <include layout="@layout/layout_update_available"/>

    </android.support.design.widget.NavigationView>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接