AppCompat style background propagated to the Image within the ToolBar

Question

Context

I\'m using the newest AppCompat v7 lib (21.0.0) and I have migrated my app from ActionBar to ToolBar

Problem

<

Answer 1

You should not be using theme like that:

• style = local to the Toolbar
• theme = global to everything inflated in the Toolbar

Workaround 2, as you call it, is kind of the correct way. If you want to extract some values into a style, you can do it as so:

<android.support.v7.widget.Toolbar
    android:id="@+id/my_awesome_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    style="@style/MyDarkToolbar" />

Style:

<style name="MyDarkToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="android:background">@color/green</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

Answer 2

Never use themes to edit. Because theme defines overall app behavior. U can use two methods for that

Method:1

U can directly specify the parameters in appbar.xml as shown below

in appbar.xml

  <?xml version="1.0" encoding="utf-8"?>
    <android.support.v7.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/green"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme=">style/ThemeOverlay.AppCompat.Light"/>

Method:2

you can use a style as Chris_Banes suggested in above post

in appbar.xml:

<android.support.v7.widget.Toolbar
    android:id="@+id/my_awesome_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    style="@style/MyDarkToolbar" />

in Style:

<style name="MyDarkToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="android:background">@color/green</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

Points To Note

With the new Toolbar you can apply a style and a theme. They are different! The style is local to the Toolbar view, for example the background color. The app:theme is instead global to all ui elements inflated in the Toolbar, for example the color of the title and icons.