Как мне оформить панель инструментов appcompat-v7, например Theme.AppCompat.Light.DarkActionBar?

Я пытаюсь воссоздать внешний вид Theme.AppCompat.Light.DarkActionBarс помощью новой панели инструментов библиотеки поддержки.

Если я выберу, Theme.AppCompat.Lightмоя панель инструментов будет светлой, а если выберу, Theme.AppCompatто темной. (Технически вы должны использовать .NoActionBarверсию, но, насколько я могу судить, единственная разница в

<style name="Theme.AppCompat.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="android:windowNoTitle">true</item>
</style>

Теперь нет, Theme.AppCompat.Light.DarkActionBarно наивно я подумал, что было бы достаточно просто сделать свой собственный

<style name="Theme.AppCompat.Light.DarkActionBar.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="android:windowNoTitle">true</item>
</style>

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

Есть ли способ получить AppCompat.Light.DarkActionBarвнешний вид с помощью импорта android.support.v7.widget.Toolbar?

Рекомендуемый способ стилизовать панель инструментов для Light.DarkActionBarклона - использовать ее в Theme.AppCompat.Light.DarkActionbarкачестве родительской темы / темы приложения и добавить в стиль следующие атрибуты, чтобы скрыть панель действий по умолчанию:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

Затем используйте в качестве панели инструментов следующее:

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>

Для дальнейших модификаций вы должны создать стили, расширяющие ThemeOverlay.AppCompat.Dark.ActionBarи ThemeOverlay.AppCompat.Lightзаменяющие стили внутри AppBarLayout->android:themeи Toolbar->app:popupTheme. Также обратите внимание, что это заберет ваш?attr/colorPrimary если вы установили его в своем основном стиле, поэтому вы можете получить другой цвет фона.

Вы найдете хороший пример этого в текущем шаблоне проекта с Empty ActivityAndroid Studio (1.4+).

Изменить: после обновления до appcompat-v7: 22.1.1 и использования AppCompatActivityвместо ActionBarActivityмоего styles.xml выглядит так:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

Примечание. Это означает, что я использую Toolbarпредоставленный фреймворком (НЕ включен в файл XML).

У меня это сработало:
файл styles.xml:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="windowActionBar">false</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

Обновление: цитата из блога Габриэле Мариотти .

С новой панелью инструментов вы можете применить стиль и тему. Они разные! Стиль является локальным для представления панели инструментов, например, цвет фона. Тема app: вместо этого является глобальной для всех элементов пользовательского интерфейса на панели инструментов, например, цвета заголовка и значков.

Хорошо, после того, как я потратил много времени на решение этой проблемы, именно так мне удалось добиться того внешнего вида, на который я надеялся. Я делаю отдельный ответ, чтобы собрать все в одном месте.

Это сочетание факторов.

Во-первых, не пытайтесь заставить панели инструментов работать просто с помощью тем. Это кажется невозможным.

Так что применяйте темы явно к своим панелям инструментов, как в ответе oRRs

макет / toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_alignParentTop="true"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:theme="@style/Dark.Overlay"
    app:popupTheme="@style/Dark.Overlay.LightPopup" />

Однако это волшебный соус. Я надеялся, что для того, чтобы получить цвета фона, вам нужно переопределить backgroundатрибут в темах панели инструментов.

значения / styles.xml:

<!-- 
    I expected android:colorBackground to be what I was looking for but
    it seems you have to override android:background
-->
<style name="Dark.Overlay" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:background">?attr/colorPrimary</item>
</style>

<style name="Dark.Overlay.LightPopup" parent="ThemeOverlay.AppCompat.Light">
    <item name="android:background">@color/material_grey_200</item>
</style>

затем просто включите макет панели инструментов в другие макеты

<include android:id="@+id/mytoolbar" layout="@layout/toolbar" />

и тебе хорошо идти.

Надеюсь, это поможет кому-то другому, поэтому вам не придется тратить на это столько времени, как у меня.

(если кто-то может понять, как сделать эту работу, используя только темы, то есть не нужно явно применять темы в файлах макета, я с радостью поддержу их ответ)

РЕДАКТИРОВАТЬ:

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

Самый простой способ, который я нашел для этого, - создать дочерний элемент ThemeOverlay.AppCompat.Dark.ActionBar . В этом примере я установил цвет фона панели инструментов на КРАСНЫЙ цвет, а цвет текста на СИНИЙ.

<style name="MyToolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:background">#FF0000</item>
    <item name="android:textColorPrimary">#0000FF</item>
</style>

Затем вы можете применить свою тему к панели инструментов:

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    app:theme="@style/MyToolbar"
    android:minHeight="?attr/actionBarSize"/>

Чтобы настроить стиль панели инструментов, сначала создайте собственный стиль панели инструментов, наследующий Widget.AppCompat.Toolbar, переопределите свойства и затем добавьте его в настраиваемую тему приложения, как показано ниже, см. Http://www.zoftino.com/android-toolbar-tutorial для панель инструментов дополнительной информации и стили.

   <style name="MyAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="toolbarStyle">@style/MyToolBarStyle</item>
    </style>
    <style name="MyToolBarStyle" parent="Widget.AppCompat.Toolbar">
        <item name="android:background">#80deea</item>
        <item name="titleTextAppearance">@style/MyTitleTextAppearance</item>
        <item name="subtitleTextAppearance">@style/MySubTitleTextAppearance</item>
    </style>
    <style name="MyTitleTextAppearance" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
        <item name="android:textSize">35dp</item>
        <item name="android:textColor">#ff3d00</item>
    </style>
    <style name="MySubTitleTextAppearance" parent="TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
        <item name="android:textSize">30dp</item>
        <item name="android:textColor">#1976d2</item>
    </style>

Вы можете попробовать это ниже.

<style name="MyToolbar" parent="Widget.AppCompat.Toolbar">
    <!-- your code here -->
</style>

А подробные элементы вы можете найти в https://developer.android.com/reference/android/support/v7/appcompat/R.styleable.html#Toolbar.

Вот еще немного: TextAppearance.Widget.AppCompat.Toolbar.Title, TextAppearance.Widget.AppCompat.Toolbar.Subtitle, Widget.AppCompat.Toolbar.Button.Navigation.

Надеюсь, это поможет тебе.

Подобно Арнаву Рао, но с другим родителем:

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <item name="toolbarStyle">@style/MyToolbar</item>
</style>

<style name="MyToolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:background">#ff0000</item>
</style>

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