¿Cómo puedo diseñar la barra de herramientas appcompat-v7 como Theme.AppCompat.Light.DarkActionBar?

Estoy tratando de recrear el aspecto de Theme.AppCompat.Light.DarkActionBarcon la nueva barra de herramientas de la biblioteca de soporte.

Si elijo, Theme.AppCompat.Lightmi barra de herramientas será clara y si elijo Theme.AppCompatestará oscura. (Técnicamente tienes que usar la .NoActionBarversión, pero por lo que puedo decir, la única diferencia es

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

Ahora no hay, Theme.AppCompat.Light.DarkActionBarpero ingenuamente pensé que sería lo suficientemente bueno hacer el mío

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

Sin embargo, con esto, mis barras de herramientas siguen siendo Lighttemáticas. He pasado horas probando diferentes combinaciones de mezclar el tema Oscuro (base) y el tema Claro, pero no puedo encontrar una combinación que me permita tener fondos claros en todo menos en las barras de herramientas.

¿Hay alguna forma de conseguir el AppCompat.Light.DarkActionBarlook con import android.support.v7.widget.Toolbar?

La forma recomendada de diseñar la barra de herramientas para un Light.DarkActionBarclon sería usar Theme.AppCompat.Light.DarkActionbarcomo tema principal / de aplicación y agregar los siguientes atributos al estilo para ocultar la barra de acciones predeterminada:

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

Luego use lo siguiente como su barra de herramientas:

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

Para modificaciones adicionales, crearía estilos extendiendo ThemeOverlay.AppCompat.Dark.ActionBary ThemeOverlay.AppCompat.Lightreemplazando los de AppBarLayout->android:themey Toolbar->app:popupTheme. También tenga en cuenta que esto se activará ?attr/colorPrimarysi lo ha configurado en su estilo principal, por lo que puede obtener un color de fondo diferente.

Encontrará un buen ejemplo de esto en la plantilla de proyecto actual con Empty ActivityAndroid Studio (1.4+).

Editar: después de actualizar a appcompat-v7: 22.1.1 y usar en AppCompatActivitylugar de ActionBarActivitymy styles.xml se ve así:

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

Nota: Esto significa que estoy usando un Toolbarmarco proporcionado por el marco (NO incluido en un archivo XML).

Esto funcionó para mí:
archivo 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>

Actualización: una cita del blog de Gabriele Mariotti .

Con la nueva barra de herramientas puede aplicar un estilo y un tema. ¡Ellos son diferentes! El estilo es local para la vista de la barra de herramientas, por ejemplo, el color de fondo. La aplicación: tema es global para todos los elementos de la interfaz de usuario inflados en la barra de herramientas, por ejemplo, el color del título y los iconos.

Ok, después de haberme sumergido mucho tiempo en este problema, esta es la forma en que logré obtener la apariencia que esperaba. Lo estoy convirtiendo en una respuesta separada para poder tener todo en un solo lugar.

Es una combinación de factores.

En primer lugar, no intente que las barras de herramientas funcionen bien solo con temas. Parece imposible.

Así que aplique temas explícitamente a sus barras de herramientas como en la respuesta de oRR

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

Sin embargo, esta es la salsa mágica. Para obtener los colores de fondo que esperaba, debe anular el backgroundatributo en los temas de la barra Google.

valores / estilos.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>

luego solo incluye el diseño de tu barra de herramientas en tus otros diseños

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

y listo.

Espero que esto ayude a alguien más para que no tenga que dedicar tanto tiempo a esto como yo.

(si alguien puede descubrir cómo hacer que esto funcione usando solo temas, es decir, sin tener que aplicar los temas explícitamente en los archivos de diseño, con gusto apoyaré su respuesta)

EDITAR:

Entonces, aparentemente, publicar una respuesta más completa fue un imán de votos negativos, así que aceptaré la respuesta incompleta anterior, pero dejaré esta respuesta aquí en caso de que alguien realmente la necesite. Sin embargo, no dudes en seguir votando negativamente si eso te hace feliz.

La forma más limpia que encontré para hacer esto es crear un elemento secundario de ' ThemeOverlay.AppCompat.Dark.ActionBar '. En el ejemplo, configuré el color de fondo de la barra de herramientas en ROJO y el color del texto en AZUL.

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

Luego puede aplicar su tema a la barra de herramientas:

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

Para personalizar el estilo de la barra de herramientas, primero cree el estilo personalizado de la barra de herramientas heredando Widget.AppCompat.Toolbar, anule las propiedades y luego agréguelo al tema de la aplicación personalizada como se muestra a continuación, consulte http://www.zoftino.com/android-toolbar-tutorial para más información barra de herramientas y estilos.

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

Puedes probar esto a continuación.

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

Y los elementos de detalle los puedes encontrar en https://developer.android.com/reference/android/support/v7/appcompat/R.styleable.html#Toolbar

Éstos son algunos más: TextAppearance.Widget.AppCompat.Toolbar.Title, TextAppearance.Widget.AppCompat.Toolbar.Subtitle, Widget.AppCompat.Toolbar.Button.Navigation.

Espero que esto le pueda ayudar.

Similar al de Arnav Rao, pero con un padre diferente:

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

Con este enfoque, la apariencia de la barra de herramientas está completamente definida en los estilos de la aplicación, por lo que no necesita colocar ningún estilo en cada barra de herramientas.