Панель действий обеспечивает вашим пользователям знакомый и предсказуемый способ выполнять действия и перемещаться по вашему приложению, но это не значит, она должна выглядеть точно так же, как и в других приложениях. Если вы хотите стилизировать панель действий, чтобы лучше соответствовать вашему продукту, вы можете легко сделать это, используя Android стиль и тема ресурсы.

Android включает в себя несколько встроенных тем для деятельности, включающие в себя «темные» или «светлые» стили панели действий. Вы также можете расширить эти темы для дальнейшей настройки внешнего вида вашей панели действий.

Примечание: Если вы используете Библиотеку поддержке для панели действий, то вы должны использовать (или переопределить) Theme.AppCompat семейство стилей (а не Theme.Holoсемейство, доступное в Уровне API 11 и выше). При этом, каждое свойство стиля, которые вы объявляете должны быть объявлено дважды: один раз с помощью свойств стиля платформы (android: свойства) и второй раз с помощью свойств стиля, включенного в Библиотеку поддержки ( appcompat.R.attr свойства—контекст для этих свойств на самом деле ваше приложение). Детали смотрите в примерах ниже.

Используйте темы Android

Android включает в себя две базовые темы для деятельности, которые диктуют цвет для панели действий:

• Theme.Holo для «темной» темы.
• Theme.Holo.Light для «светлой» темы.

Вы можете применить эти темы для всего приложения или отдельных деятельностей, объявив их в вашем файле манифеста, используя android:theme атрибут для<application> элемента либо индивидуально для <activity> элементов.

Например:

<application android:theme="@android:style/Theme.Holo.Light" ... />

Вы также можете использовать темную панель действий в то время как остальная часть деятельности использует светлую цветовую схему, объявивTheme.Holo.Light.DarkActionBar тему.

При использовании Библиотеки поддержки, необходимо использовать вместо этогоTheme.AppCompat темы:

• Theme.AppCompat для «темной» темы.
• Theme.AppCompat.Light для «светлой» темы.
• Theme.AppCompat.Light.DarkActionBar для светлой темы с темным панелями действий.

Убедитесь, что вы используете значки для панелей действий, которые должным образом контрастируют с цветом вашей панели действий. Чтобы помочь вам, Набор иконок для панели действий включает в себя иконки для стандартных действий для использования как с Holo light, так и с Holo dark панелями действий.

Настроить фон

Чтобы изменить фон панели действий, создайте собственную тему для вашей деятельности, которая перекрывает actionBarStyleсвойство. Это свойство указывает на другой стиль, в котором можно переопределитьbackground свойство для указания рисуемого ресурса для фона панели действий.

Если ваше приложение использует навигационные вкладки или разделённую панель действий, то вы также можете указать фон для этих панелей помощью backgroundStacked и backgroundSplitсвойств, соответственно.

Внимание: Важно, чтобы вы объявляли соответствующую родительскую тему, из которой ваша пользовательская тема и стиль наследуют свои стили. Без родительского стиля, панель действий будет без многих свойств стиля, если явно не объявлять их самостоятельно.

Только для Android 3.0 и выше

При поддержке Android 3.0 и выше только, вы можете определить фон панели действий так:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@android:style/Theme.Holo.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>

    <!-- ActionBar styles -->
    <style name="MyActionBar"
           parent="@android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@drawable/actionbar_background</item>
    </style>
</resources>

Затем примените вашу тему для всего приложения или для отдельных деятельностей:

<application android:theme="@style/CustomActionBarTheme" ... />

Для Android 2.1 и выше

При использовании Библиотеки поддержки, та же тема, что и выше должна вместо этого выглядеть следующим образом:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/MyActionBar</item>

        <!-- Support library compatibility -->
        <item name="actionBarStyle">@style/MyActionBar</item>
    </style>

    <!-- ActionBar styles -->
    <style name="MyActionBar"
           parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@drawable/actionbar_background</item>

        <!-- Support library compatibility -->
        <item name="background">@drawable/actionbar_background</item>
    </style>
</resources>

Затем примените вашу тему для всего приложения или для отдельных деятельностей:

<application android:theme="@style/CustomActionBarTheme" ... />

Настроить цвет текста

Чтобы изменить цвет текста в панели действий, вам необходимо переопределить отдельные свойства для каждого текстового элемента:

• Заголовок панели действий: Создание пользовательский стил, который определяет textColorсвойство и укажите этот стиль для titleTextStyle свойства в вашем actionBarStyle.

  Примечание: Пользовательский стиль применяемый к titleTextStyle должен использоватьTextAppearance.Holo.Widget.ActionBar.Title в качестве родительского стиля.

• Вкладки панели действий: Переопределите actionBarTabTextStyle в теме деятельности.
• Кнопки действий: Переопределите actionMenuTextColor в теме деятельности.

Только для Android 3.0 и выше

При поддержке только Android 3.0 и выше, ваш XML файл со стилем может выглядеть следующим образом:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.Holo">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="android:actionBarTabTextStyle">@style/MyActionBarTabText</item>
        <item name="android:actionMenuTextColor">@color/actionbar_text</item>
    </style>

    <!-- ActionBar styles -->
    <style name="MyActionBar"
           parent="@style/Widget.Holo.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

    <!-- ActionBar title text -->
    <style name="MyActionBarTitleText"
           parent="@style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>

    <!-- ActionBar tabs text styles -->
    <style name="MyActionBarTabText"
           parent="@style/Widget.Holo.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>
</resources>

Для Android 2.1 и выше

При использовании Библиотеки поддержки, ваш XML файл со стилем может выглядеть следующим образом:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.AppCompat">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="android:actionBarTabTextStyle">@style/MyActionBarTabText</item>
        <item name="android:actionMenuTextColor">@color/actionbar_text</item>

        <!-- Support library compatibility -->
        <item name="actionBarStyle">@style/MyActionBar</item>
        <item name="actionBarTabTextStyle">@style/MyActionBarTabText</item>
        <item name="actionMenuTextColor">@color/actionbar_text</item>
    </style>

    <!-- ActionBar styles -->
    <style name="MyActionBar"
           parent="@style/Widget.AppCompat.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>

        <!-- Support library compatibility -->
        <item name="titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

    <!-- ActionBar title text -->
    <style name="MyActionBarTitleText"
           parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
        <!-- The textColor property is backward compatible with the Support Library -->
    </style>

    <!-- ActionBar tabs text -->
    <style name="MyActionBarTabText"
           parent="@style/Widget.AppCompat.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
        <!-- The textColor property is backward compatible with the Support Library -->
    </style>
</resources>

Настроить индикатор вкладки

Чтобы изменить индикатор, используемый длянавигационных вкладок, создайте тему для деятельности, которая переопределяетactionBarTabStyle свойство. Это свойство указывает на другой ресурс стиля, в котором вы переопределите background свойство, которое должно указать рисуемый список состояний.

Примечание: Рисуемый список состояний очень важен, потому что выбранная в настоящее время вкладка указывает на его состояние с другим фоном, отличающимся от других вкладок. Дополнительные сведения о том, как создать рисуемый ресурс, который управляет разными состояниями кнопок, читайте Список состояний.

Например, вот рисуемый список состояний, который объявляет конкретное фоновое изображение для нескольких различных состояний вкладки панели действий:

res/drawable/actionbar_tab_indicator.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<!-- STATES WHEN BUTTON IS NOT PRESSED -->

    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false"
          android:state_pressed="false"
          android:drawable="@drawable/tab_unselected" />
    <item android:state_focused="false" android:state_selected="true"
          android:state_pressed="false"
          android:drawable="@drawable/tab_selected" />

    <!-- Focused states (such as when focused with a d-pad or mouse hover) -->
    <item android:state_focused="true" android:state_selected="false"
          android:state_pressed="false"
          android:drawable="@drawable/tab_unselected_focused" />
    <item android:state_focused="true" android:state_selected="true"
          android:state_pressed="false"
          android:drawable="@drawable/tab_selected_focused" />


<!-- STATES WHEN BUTTON IS PRESSED -->

    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false"
          android:state_pressed="true"
          android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="false" android:state_selected="true"
        android:state_pressed="true"
        android:drawable="@drawable/tab_selected_pressed" />

    <!-- Focused states (such as when focused with a d-pad or mouse hover) -->
    <item android:state_focused="true" android:state_selected="false"
          android:state_pressed="true"
          android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="true" android:state_selected="true"
          android:state_pressed="true"
          android:drawable="@drawable/tab_selected_pressed" />
</selector>

Только для Android 3.0 и выше

При поддержке только Android 3.0 и выше, ваш XML файл со стилем может выглядеть следующим образом:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.Holo">
        <item name="android:actionBarTabStyle">@style/MyActionBarTabs</item>
    </style>

    <!-- ActionBar tabs styles -->
    <style name="MyActionBarTabs"
           parent="@style/Widget.Holo.ActionBar.TabView">
        <!-- tab indicator -->
        <item name="android:background">@drawable/actionbar_tab_indicator</item>
    </style>
</resources>

Для Android 2.1 и выше

При использовании Библиотеки поддержки, ваш XML файл со стилем может выглядеть следующим образом:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.AppCompat">
        <item name="android:actionBarTabStyle">@style/MyActionBarTabs</item>

        <!-- Support library compatibility -->
        <item name="actionBarTabStyle">@style/MyActionBarTabs</item>
    </style>

    <!-- ActionBar tabs styles -->
    <style name="MyActionBarTabs"
           parent="@style/Widget.AppCompat.ActionBar.TabView">
        <!-- tab indicator -->
        <item name="android:background">@drawable/actionbar_tab_indicator</item>

        <!-- Support library compatibility -->
        <item name="background">@drawable/actionbar_tab_indicator</item>
    </style>
</resources>