CODEWITHSUNDEEP
androidstylingandroid-5.0-lollipopandroid-toolbar
rgamber
rgamber

Reputation: 5849

Correct way of styling Android Lollipop 5.0 Toolbar

I have been banging my head over this for some time now without any luck. I am using the android.support.v7.widget.Toolbar in my App (which supports Android API 11 and above), and want to style it. Here is how I am trying it:

My Activity Layout XML contains:

        <android.support.v7.widget.Toolbar
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:theme="?attr/foo" />

res/values/attr.xml contains (this is where I define my attributes):

        <attr name="foo" format="reference" />

res/values/Themes.xml:

    <style name="AppTheme" parent="Theme_one">
    </style>
    <style name="Theme_one" parent="@style/Theme.AppCompat.Light">
        <item name="windowActionBar">false</item> 
        <item name="foo">@style/foo_style</item>
        <!-- bunch of other styles -->
    </style>

res/values/Styles.xml:

<style name="foo_style" parent="@style/Theme.AppCompat.Light">
    <item name="android:background">@color/actionBarDark</item>
</style>

res/values-v21/Themes.xml:

<style name="AppTheme" parent="Theme_one">
    <!-- some v21 specific items not related to toolbar like animations etc-->
</style>

res/values-v21/Styles.xml:

<style name="foo_style" parent="@style/Theme.AppCompat.Light">
    <item name="android:colorPrimaryDark">@color/actionBarDark</item> <!-- THIS DOES NOT WORK !!! -->
    <item name="android:background">@color/actionBarDark</item>
    <item name="android:elevation">5dp</item>
</style>

This arrangement works fine for Android API v11 to v19. My issues for v21 (I also tried 2 and 3 without the android: prefix with same result):

1) android:background works fine!
2) android:colorPrimaryDark does not work!
3) android:elevation applies to the title of the Toolbar and the Toolbar buttons as below. Is this expected?
enter image description here

What am I missing? Clearly I am not doing the styling the correct way, but unable to find any resources which talk about toolbar styling!

Upvotes: 3

Views: 1707

Answers (1)

rgamber
rgamber

Reputation: 5849

I got colorPrimaryDark to work by by moving the:

<item name="colorPrimaryDark">@color/actionBarDark</item>

from res/values-v21/Styles.xml to res/values-v21/Themes.xml.

I got the elevation to work by removing it from all styles or theme xmls, and putting it in the android.support.v7.widget.Toolbar declaration.

Also, If I define another theme here and change it dynamically in the app using Content.setTheme(), the theme changes but the status bar color does not. Any suggestions are welcome.

Upvotes: 1

Related Questions