Mengubah warna teks item menu di panel samping navigasi


90

Saya mencoba menambahkan tema malam untuk aplikasi saya dan saya telah menyia-nyiakan hampir tiga jam hanya untuk mencoba membuat teks dan ikon di laci navigasi saya menjadi putih bersama dengan latar belakang gelap. Inilah cara saya mencoba melakukan ini onCreate()di 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);
        }

The nightModeboolean tidak relevan karena ia bekerja. Saat mode malam disetel ke aktif (0), item menu apa pun yang dipilih di panel samping navigasi berubah menjadi putih. Namun, itu hanya terjadi ketika setiap item dipilih yang jelas tidak nyaman. Ini drawer_dark.xml saya:

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

Saya menggunakan ikon putih pada latar belakang transparan untuk setiap item, namun ikon tersebut muncul sebagai hitam pada latar belakang hitam panel samping navigasi. Saya telah mencoba mencari solusi xml untuk mengubah warna teks dan saya menggaruk-garuk kepala karena saya tidak tahu mengapa hal ini terlewatkan.

Dapatkah seseorang menawarkan solusi dinamis untuk mendapatkan apa yang ingin saya capai? Semua bantuan dihargai, terima kasih!

EDIT: Saya tidak menggunakan pustaka pihak ketiga, ini adalah NavigationView yang disediakan di pustaka dukungan. Berikut tata letak 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>

mengapa Anda tidak mengubah saja tema Aktivitas dari Lightmenjadi Darkdan sebaliknya ..
Emil

@Boss dengan cara aplikasi saya diprogram, itu akan menjadi proses yang membosankan. Saya memiliki tema siang / malam ini bekerja dengan sempurna di tempat lain kecuali laci navigasi saya, jadi yang saya butuhkan hanyalah memperbaikinya.
wasimsandhu

Jawaban:


248
 <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
Ini akan menyetel warna setiap item dari panel samping navigasi ke "warna Anda". Apakah ada cara untuk mengubah warna satu per satu untuk setiap kelompok laci?
Akeshwar Jha

2
@Akeshwar, Anda dapat mencoba melakukan itu secara terprogram, namun, saya tidak akan merekomendasikan hal itu karena bertentangan dengan pedoman Material.
Abdellah Benhammou

ya, ada juga cara untuk mengubah warna satu per satu!

2
@NehaTyagi Cara mengubah gaya font di item menu dari xml.
Chetan Joshi

@Hara Hara Mahadevaki Bisakah Anda memberi tahu saya itu?
anju jo

44

Gunakan app: itemIconTint di NavigationView Anda, 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
dan tentang warna teks item yang dipilih?
Usman Rana

28

NavigationViewmemiliki metode yang disebut setItemTextColor(). Ini menggunakan 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);

Di sinilah saya mendapat jawaban itu. Dan kemudian tepat setelah menetapkan NavigationView saya:

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

Hai, apakah ada cara untuk mengubah warna setiap grup panel samping navigasi satu per satu?
Akeshwar Jha

masih berwarna abu-abu

Bagaimana cara mengubah warna teks grup?
Ari

15

Opsi lanjutan:

Anda juga dapat mengubah judul grup dengan mengganti "textColorSecondary"

Di styles.xml Anda

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

Dalam tata letak Anda

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

Solusi ini membantu saya memperbaiki masalah warna saya. Terima kasih!
Mark Delphi

10

tambahkan app: itemTextColor = "# fff" di NavigationView Anda seperti

 <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

Saya menggunakan kode di bawah ini untuk mengubah warna teks laci Navigasi di aplikasi saya.

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

4

Di Masa Depan jika ada yang datang ke sini menggunakan, Aktivitas Laci Navigasi (disediakan oleh Studio di jendela Prompt Aktivitas)

Jawabannya adalah -

Gunakan ini sebelum OnCreate () di 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);

dan gunakan ini di onNavigationItemSelected () di MainActivity (Anda tidak perlu Menulis fungsi ini jika Anda menggunakan aktivitas Panel Samping Navigasi, ini akan ditambahkan di MainActivity).

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

Tip - tambahkan kode ini sebelum kondisi If else di onNavigationItemSelected ()


4

Ini berhasil untuk saya. sebagai ganti customTheme Anda bisa menempatkan tema Anda dalam gaya. dalam kode ini Anda juga dapat mengubah font dan ukuran teks.

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

di sini adalah tampilan navigasi saya

<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

Anda dapat melakukannya hanya dengan menambahkan tema Anda ke Tampilan navigasi Anda.

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

dan di file style.xml Anda, Anda akan menambahkan tema ini

   <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

Anda dapat menggunakan drawable di

app: aplikasi itemTextColor: itemIconTint

maka Anda dapat mengontrol status yang dicentang dan status normal menggunakan 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>

3

coba ini di kelas 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
            }
    ));

2

Ini dapat membantu. Ini berhasil untuk saya

Pergi ke activity_ "navigation activity name" .xml Di dalam NavigationView masukkan kode ini

app:itemTextColor="color of your choice"

2

Dalam kasus saya, saya perlu mengubah warna hanya satu item menu - "Logout". Saya harus menjalankan rekursi dan mengubah warna judul:

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

        }

    }

Saya melakukan ini dalam metode onCreate Aktivitas.


Mengapa tidak menemukan item berdasarkan ID?
Ahmed Awadallah

1

Anda juga dapat menentukan tema khusus yang diturunkan dari tema dasar Anda:

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

dan kemudian di file styles.xml Anda:

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

Anda juga dapat menerapkan lebih banyak atribut ke tema khusus.


1

Untuk mengubah warna teks individual dari satu item, gunakan SpannableString seperti di bawah ini:

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

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

Untuk mengatur Latar Belakang Item menggunakan app: itemBackground

drawer_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, jika Anda ingin mengubah warna ikon

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

untuk mengubah warna teks Panel Samping Navigasi

kita gunakan app:itemTextColor="@color/white"

untuk mengubah warna incon dari laci navigasi

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

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.