Styling the android.support.v7.widget.Toolbar with AppCompat from styles.xml

Question

I've got a problem with styling a Toolbar inside a CoordinatorLayout / AppBarLayout from my styles.xml file in combination with using AppCompat from the 23.1.1 support libraries.

The problem I want to solve: My activity is used from different app projects, all of which use Theme.AppCompat.Light.NoActionBar. Some apps have light primary colors where everything is fine. Some, however, have dark primary colors that would require setting android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" on the Toolbar in the activity's layout file - which I cannot do as the same code and resource files are used by the other apps as well.

EDIT: I think I got this solved now. Keeping the styles.xml as it was, in the Activity I now inherit the actionBarTheme as follows (got the idea from reading http://developer.android.com/reference/android/R.styleable.html#Theme_toolbarStyle):

<android.support.v7.widget.Toolbar
    android:id="@+id/webview_toolbar"
    android:fitsSystemWindows="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="?attr/actionBarTheme"/>

See the following related questions and blog posts:

After reading all of the above, I tried to solve my problem by deriving an app theme from Theme.AppCompat.Light.DarkActionBar (instead of *.NoActionBar) in those apps that have dark primary colors and applying all styles that let the action bar go away. Out of despair, I have even tried to set actionBarTheme and actionBarStyle.

My app has a styles.xml file that looks like this:

<style name="MyTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimaryDark">@color/myDarkRed</item>
    <item name="colorPrimary">@color/myRed</item>
    <item name="colorAccent">@color/myOrange</item>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="actionBarTheme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
    <item name="actionBarStyle">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

My activity (derived from AppCompatActivity) has a layout.xml that looks like this:

<android.support.v7.widget.Toolbar
    android:id="@+id/webview_toolbar"
    android:fitsSystemWindows="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Unfortunately, my Activity still has dark text color on the toolbar. What am I doing wrong?

Now, after being desperate enough to ask for help, I finally found something that might be what I need: use "?attr" to inherit the theme from the app does work. Will edit my post. — Mark Asbach, Dec 03 '15 at 12:05

score 0 · Answer 1 · answered Dec 03 '15 at 08:21

this one work for me

<style name="MyToolbarTheme">
        <!-- Used to tint the back arrow, menu and spinner arrow -->
        <item name="colorPrimary">#ffffff</item>
        <item name="colorPrimaryDark">#ffffff</item>
        <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
        <item name="colorControlNormal">#ff0000</item>
        <item name="android:textColor">#ffffff</item>
        <item name="android:textColorHighlight">#ffffff</item>
        <item name="actionOverflowMenuStyle">@style/CMOptionsMenu</item>
        <item name="searchViewStyle">@style/MySearchViewStyle</item>

    </style>

    <style name="CMOptionsMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
        <item name="android:popupBackground">#ffffff</item>
    </style>

    <style name="MySearchViewStyle" parent="Widget.AppCompat.SearchView">
        <item name="android:textColor">@android:color/black</item>
    </style>

This one seems to work - however, it does define everything by itself rather than deriving it from the ThemeOverlay, which might cause side-effects with other widgets (although I didn't notice any). — Mark Asbach, Dec 03 '15 at 12:03

score 0 · Answer 2 · answered Dec 03 '15 at 12:11

0

You can set on Toolbar your own generic style

android:theme="@style/myToolBarLightOrDark"

then in styles.xml set inheriting it from Light or Dark ThemeOverlay ActionBar.

answered Dec 03 '15 at 12:11

GPack

2,494
4
19
50

`` android.view.InflateException: Binary XML file line #13: Binary XML file line #13: Error inflating class android.support.v7.widget.Toolbar if I change to app:theme="@style/MainActionBar" it works fine but deprecated warning – Ehask Jan 11 '16 at 20:23

Styling the android.support.v7.widget.Toolbar with AppCompat from styles.xml

2 Answers2