Thay đổi màu văn bản của mục menu trong ngăn điều hướng


89

Tôi đang cố gắng thêm chủ đề ban đêm cho ứng dụng của mình và tôi đã lãng phí gần ba giờ chỉ để cố gắng làm cho văn bản và biểu tượng trong ngăn điều hướng của tôi chuyển sang màu trắng cùng với nền tối. Đây là cách tôi đang cố gắng thực hiện điều này onCreate()trong MainActivity.java:

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);
        }

Các nightModeboolean là không thích hợp vì nó hoạt động. Khi chế độ ban đêm được đặt thành (0), bất kỳ mục menu nào được chọn trong ngăn điều hướng sẽ chuyển sang màu trắng. Tuy nhiên, điều đó chỉ xảy ra khi chọn từng mục rõ ràng là bất tiện. Đây là draw_dark.xml của tôi:

    <?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>

Tôi đang sử dụng các biểu tượng màu trắng trên nền trong suốt cho từng mục, nhưng chúng hiển thị dưới dạng màu đen trên nền đen của ngăn điều hướng. Tôi đã thử tìm kiếm giải pháp xml để thay đổi màu sắc của văn bản và tôi đang vò đầu bứt tai vì không biết tại sao điều này lại bị bỏ qua.

Ai đó có thể cung cấp cho tôi một giải pháp năng động để đạt được những gì tôi đang cố gắng đạt được không? Tất cả sự giúp đỡ được đánh giá cao, cảm ơn bạn!

CHỈNH SỬA: Tôi không sử dụng thư viện của bên thứ ba, đó là NavigationView được cung cấp trong thư viện hỗ trợ. Đây là bố cục 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>

tại sao bạn không thay đổi chủ đề Hoạt động từ Lightthành Darkvà ngược lại ..
Emil

@Boss với cách ứng dụng của tôi được lập trình, đó sẽ là một quá trình tẻ nhạt. Tôi có chủ đề ngày / đêm này hoạt động hoàn hảo ở mọi nơi khác nhưng ngăn điều hướng của tôi, vì vậy tất cả những gì tôi cần là sửa lỗi cho điều đó.
wasimsandhu

Câu trả lời:


244
 <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" />

29
Thao tác này sẽ đặt màu của mọi mục trong ngăn điều hướng thành "màu của bạn". Có cách nào để thay đổi màu riêng lẻ cho từng nhóm ngăn kéo không?
Akeshwar Jha

2
@Akeshwar, bạn có thể thử làm điều đó theo chương trình, tuy nhiên, tôi không khuyên bạn nên làm điều đó vì nó đi ngược lại các nguyên tắc của Material.
Abdellah Benhammou

vâng, có một cách để thay đổi màu sắc riêng lẻ!

2
@NehaTyagi Cách thay đổi kiểu phông chữ trong các mục menu từ xml.
Chetan Joshi

@Hara Hara Mahadevaki Bạn có thể cho tôi biết điều đó được không?
anju jo

43

Sử dụng ứng dụng: itemIconTint trong NavigationView của bạn, ej:

<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" />

3
và màu văn bản mục đã chọn là gì?
Usman Rana

28

NavigationViewcó một phương thức được gọi setItemTextColor(). Nó sử dụng a 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);

Đây là nơi tôi nhận được câu trả lời đó. Và ngay sau khi gán NavigationView của tôi:

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

Xin chào, có cách nào để thay đổi màu của từng nhóm ngăn điều hướng riêng lẻ không?
Akeshwar Jha

vẫn xám của mình trong màu

Làm thế nào để thay đổi màu văn bản nhóm?
Ari

15

Lựa chọn khác:

bạn cũng có thể thay đổi tiêu đề nhóm bằng cách ghi đè "textColorSecondary"

Trong styles.xml của bạn

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

Trong bố cục của bạn

<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"/>

Giải pháp này đã giúp tôi khắc phục sự cố màu sắc của mình. Cảm ơn bạn!
Mark Delphi

10

thêm ứng dụng: itemTextColor = "# fff" trong Điều hướng của bạn

 <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

Tôi đã sử dụng mã bên dưới để thay đổi màu văn bản của ngăn Điều hướng trong ứng dụng của mình.

NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setItemTextColor(ColorStateList.valueOf(Color.WHITE));

4

Điều này làm việc cho tôi. thay vì tùy chỉnh Chủ đề bạn có thể đặt chủ đề của bạn theo phong cách. trong mã này, bạn cũng có thể thay đổi phông chữ và kích thước văn bản.

    <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>

đây là chế độ xem điều hướng của tôi

<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>

4

Bạn có thể thực hiện đơn giản bằng cách thêm chủ đề của mình vào Chế độ xem điều hướng.

    <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"/>

và trong tệp style.xml của bạn, bạn sẽ thêm chủ đề này

   <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

Bạn có thể sử dụng đồ có thể kéo được trong

app: itemTextColor app: itemIconTint

thì bạn có thể kiểm soát trạng thái đã kiểm tra và trạng thái bình thường bằng cách sử dụng

<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">

draw_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>

3

thử cái này trong lớp java

yourNavigationView.setItemTextColor(new ColorStateList(
            new int [] [] {
                    new int [] {android.R.attr.state_pressed},
                    new int [] {android.R.attr.state_focused},
                    new int [] {}
            },
            new int [] {
                    Color.rgb (255, 128, 192),
                    Color.rgb (100, 200, 192),
                    Color.WHITE
            }
    ));

3

Trong tương lai nếu có ai đến đây sử dụng, Hoạt động ngăn điều hướng (do Studio cung cấp trong cửa sổ Nhắc hoạt động)

Câu trả lời là -

Sử dụng điều này trước OnCreate () trong MainActivity

int[][] state = new int[][] {
        new int[] {android.R.attr.state_checked}, // checked
        new int[] {-android.R.attr.state_checked}
};

int[] color = new int[] {
        Color.rgb(255,46,84),
        (Color.BLACK)
};

ColorStateList csl = new ColorStateList(state, color);

int[][] state2 = new int[][] {
        new int[] {android.R.attr.state_checked}, // checked
        new int[] {-android.R.attr.state_checked}
};

int[] color2 = new int[] {
        Color.rgb(255,46,84),
        (Color.GRAY)
};

ColorStateList csl2 = new ColorStateList(state2, color2);

và sử dụng hàm này trong onNavigationItemSelected () trong MainActivity (bạn không cần phải Viết hàm này nếu bạn sử dụng hoạt động Ngăn kéo Điều hướng, nó sẽ được thêm vào MainActivity).

 NavigationView nav = (NavigationView) findViewById(R.id.nav_view);
    nav.setItemTextColor(csl);
    nav.setItemIconTintList(csl2);
    nav.setItemBackgroundResource(R.color.white);

Mẹo - thêm mã này trước If else Điều kiện trong onNavigationItemSelected ()


2

Điều này có thể hữu ích Nó đã làm việc cho tôi

Đi tới activity_ "tên hoạt động điều hướng" .xml Inside NavigationView chèn mã này

app:itemTextColor="color of your choice"

1

Bạn cũng có thể xác định một chủ đề tùy chỉnh có nguồn gốc từ chủ đề cơ sở của bạn:

<android.support.design.widget.NavigationView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:id="@+id/nav_view"
        app:headerLayout="@layout/nav_view_header"
        app:menu="@layout/nav_view_menu"
        app:theme="@style/MyTheme.NavMenu" />

và sau đó trong tệp styles.xml của bạn:

  <style name="MyTheme.NavMenu" parent="MyTheme.Base">
    <item name="android:textColorPrimary">@color/yourcolor</item>
  </style>

bạn cũng có thể áp dụng nhiều thuộc tính hơn cho chủ đề tùy chỉnh.


1

Để thay đổi màu văn bản riêng lẻ của một mục, hãy sử dụng SpannableString như bên dưới:

SpannableString spannableString = new SpannableString("Menu item"));
        spannableString.setSpan(new ForegroundColorSpan(getResources().getColor(R.color.colorPrimary)), 0, spannableString.length(), 0);

menu.findItem(R.id.nav_item).setTitle(spannableString);

1

Trong trường hợp của tôi, tôi chỉ cần thay đổi màu của một mục menu - "Đăng xuất". Tôi đã phải chạy đệ quy và thay đổi màu tiêu đề:

NavigationView nvDrawer;
Menu menu = nvDrawer.getMenu();
    for (int i = 0; i < menu.size(); i ++){
        MenuItem menuItem = menu.getItem(i);

        if (menuItem.getTitle().equals("Logout")){

            SpannableString spanString = new SpannableString(menuItem.getTitle().toString());
            spanString.setSpan(new ForegroundColorSpan(getResources().getColor(R.color.red)), 0, spanString.length(), 0);
            menuItem.setTitle(spanString);

        }

    }

Tôi đã làm điều này trong phương thức onCreate của Activity.


0
 <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:itemBackground="@drawable/drawer_item_bg"
        app:headerLayout="@layout/nav_header_home"
        app:menu="@menu/app_home_drawer" />

Để đặt Nền mục bằng ứng dụng: itemBackground

draw_item_bg.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item android:top="-2dp" android:right="-2dp" android:left="-2dp">
        <shape>
            <padding android:bottom="0dp" android:left="15dp" android:right="0dp" android:top="0dp"/>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="0.5dp"
                android:color="#CACACA" />
        </shape>
    </item>
</layer-list>

0

itemIconTint, nếu bạn muốn thay đổi màu biểu tượng

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:itemTextColor="@color/colorPrimary"
            app:itemIconTint="@color/colorPrimary"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer" />

0

để thay đổi màu văn bản của Ngăn điều hướng

chúng tôi sử dụng app:itemTextColor="@color/white"

để thay đổi màu sắc của ngăn điều hướng

sử dụng 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"
        />

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.