Как настроить цвет фона элемента и цвета текста внутри NavigationView?

Я хочу добиться чего-то подобного в Документах по дизайну материалов.

colorControlHighlight используется для фона для отмеченных элементов.

Мне нужно настроить:

  • фон не отмечен
  • отмечен цвет текста
  • цвет текста не отмечен

Ответ 1

NavigationDrawer (NavigationView) имеет три варианта настройки отмеченных/выбранных элементов.

app:itemIconTint="@color/menu_text_color" //icon color
app:itemTextColor="@color/menu_text_color" //text color
app:itemBackground="@drawable/menu_background_color" //background

Значок и цвет текста

Первые два параметра (значок и текст) нуждаются в ресурсе списка состояний цвета - https://developer.android.com/guide/topics/resources/color-list-resource.html.

Такой ресурс menu_text_color должен быть создан в res/color. Содержимое этого файла должно выглядеть так:

<!-- res/color/menu_text_color.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="@color/colorWhite" android:state_checked="true" />
  <item android:color="@color/colorBlack" android:state_checked="false"/>
</selector>
  • @color/colorWhite - ресурс цвета, используемый для отмеченного элемента

  • @color/colorBlack - цветной ресурс, используемый для непроверенного элемента

Я создал один ресурс для обоих, но можно создать два разделенных файла - один для текста, один для значка.

Фон (itemBackground)

Фоновая опция требует ресурса с выделением, а не цвета, каждая попытка установить цвет завершается по исключению. Живой ресурс должен быть создан в res/drawable, и его содержимое должно выглядеть примерно так:

<!-- res/drawable/menu_background_color.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@android:color/transparent"  android:state_checked="false"/>
  <item android:drawable="@color/colorPrimary" android:state_checked="true"/>
</selector>

Нет необходимости создавать какие-либо чертежи, которые имитируют цвет (в других решениях, которые я видел, таких предложений - возможно, для старой версии sdk), цвет может использоваться в этом файле напрямую. В этом примере файла я использую прозрачный цвет для не отмеченного элемента и colorPrimary для отмеченного элемента.

Устранение неисправностей и важные примечания

  • В фоновом режиме всегда используйте state_checked = "false" , а не по умолчанию, при этом цвет по умолчанию не будет работать.
  • Для динамического/программно созданного меню не забудьте указать элементы как проверяемые:

Пример кода (добавление динамического меню):

  menu.add(group_id, item_id, Menu.NONE, item_name).setCheckable(true).setChecked(false);

Если элементы не будут установлены как проверяемые, то фон не будет работать (текст и цвет значков будут работать как ожидалось).

Ответ 2

itemBackground, itemIconTint и itemTextColor - простые xml-атрибуты, которые могут быть установлены, хотя вам нужно использовать собственный префикс вместо android:.

Пример

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Other layout views -->

    <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/my_ripple"
        app:itemIconTint="#2196f3"
        app:itemTextColor="#009688"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/drawer_view" />

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

Примечание: В этом случае цвет текста, оттенок и фон являются статическими. Если вы хотите изменить цвет текста (например, розовый, если его не отмечать и чинить, если вы его отметили), вы должны использовать ColorStateList.

Пример

Создайте новый *.xml файл в /res/color - назовите его state_list.xml - со следующим содержимым:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- This is used when the Navigation Item is checked -->
    <item android:color="#009688" android:state_checked="true" />
    <!-- This is the default text color -->
    <item android:color="#E91E63" />
</selector>

а затем просто ссылайтесь на него следующим образом: app:itemTextColor="@color/state_list"

То же самое относится к itemIconTint. itemBackground ожидает идентификатор ресурса. См. Также docs.

Ответ 3

Использование colorControlHighlight - хорошее решение для меня. Имейте в виду, что с помощью последней библиотеки поддержки вы можете определить тему (а не только стиль) для каждого виджета; например, вы можете определить colorControlHighlight в теме NavigationView, и это не будет применяться к остальным виджетам.

Ответ 4

Теперь в режиме навигации вы также можете просмотреть свой собственный вид. С помощью нового appcompat-v7:23.1.0 вы можете

установить пользовательские представления для элементов через приложение: actionLayout или с помощью MenuItemCompat.setActionView().

View view = View.inflate(context, R.layout.your_custom_nav_layout_item, null);
MenuItemCompat.setActionView(menuItem, view); 

Таким образом вы можете создать свой собственный макет с помощью TextView и изменить backgrounds/colors/fonts, но вы хотите. Надеюсь, это было полезно:)  Источник

Ответ 5

Вы можете программно использовать этот код:

int[][] states = new int[][] {
    new int[] { android.R.attr.state_enabled}, // enabled
    new int[] {-android.R.attr.state_enabled}, // disabled
    new int[] {-android.R.attr.state_checked}, // unchecked
    new int[] { android.R.attr.state_pressed}  // pressed
};

int[] colors = new int[] {
    Color.BLACK,
    Color.RED,
    Color.GREEN,
    Color.BLUE
};

ColorStateList myList = new ColorStateList(states, colors);

  nav_view.setItemIconTintList(myList);

Ответ 6

Вы можете сделать это, используя следующую инструкцию:

navigationView.setItemBackground(ContextCompat.getDrawable(CustomerHomeActivity.this, R.color.transparent));