Felix
Felix

Reputation: 89566

Common styles for v10 and v11+?

I'm using the v7 support library in order to have an ActionBar on API Level 10+ (that's Android 2.3.3+). Now, I want to customize the look a bit, so I added an application theme. Excerpt of my values/styles.xml:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="actionBarStyle">@style/ActionBarStyle</item>
</style>

<style name="ActionBarStyle" parent="@style/Widget.AppCompat.ActionBar">
    <item name="background">@drawable/bg_actionbar</item>
</style>

This works fine on Android 2.3.3, where the compat stuff is used. However, on Android 4.3 on an N4 (or an emulator), the styles are not applied. If I change the styles.xml file to:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:actionBarStyle">@style/ActionBarStyle</item>
</style>

<style name="ActionBarStyle" parent="@style/Widget.AppCompat.ActionBar">
    <item name="android:background">@drawable/bg_actionbar</item>
</style>

(notice the added android: prefix) it works on 4.3, but doesn't on 2.3 (styles not applied).

Is there any way I can get around this without specifying each <item> twice, once with the prefix and once without?

Upvotes: 5

Views: 2174

Answers (3)

Vikram
Vikram

Reputation: 51571

Is there any way I can get around this without specifying each <item> twice, once with the prefix and once without?

Another way would be to create version specific res/values-XX folders.

Since the divide is version 10 and versions 10+, you can create res/values-v10/styles.xml containing:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="actionBarStyle">@style/ActionBarStyle</item>
</style>

<style name="ActionBarStyle" parent="@style/Widget.AppCompat.ActionBar">
    <item name="background">@drawable/bg_actionbar</item>
</style>

Let versions 10+ deal with the default res/values/styles.xml:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:actionBarStyle">@style/ActionBarStyle</item>
</style>

<style name="ActionBarStyle" parent="@style/Widget.AppCompat.ActionBar">
    <item name="android:background">@drawable/bg_actionbar</item>
</style>

Still, it isn't much different from specifying <item></item> twice.

For reference, you can look at the project structure of ActionBarSherlock. That should provide you some pointers.

You can also take a look at: Applying Styles and Themes to the UI. Scroll down to sub-section Select a theme based on platform version.

Upvotes: 4

Patrick
Patrick

Reputation: 35224

There is a perfect example on the google docs site:

http://developer.android.com/guide/topics/ui/actionbar.html#StyleExample

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.AppCompat.Light">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="android:actionBarTabTextStyle">@style/TabTextStyle</item>
        <item name="android:actionMenuTextColor">@color/actionbar_text</item>

        <!-- Support library compatibility -->
        <item name="actionBarStyle">@style/MyActionBar</item>
        <item name="actionBarTabTextStyle">@style/TabTextStyle</item>
        <item name="actionMenuTextColor">@color/actionbar_text</item>
    </style>

    <!-- general styles for the action bar -->
    <style name="MyActionBar"
           parent="@style/Widget.AppCompat.ActionBar">
        <item name="android:titleTextStyle">@style/TitleTextStyle</item>
        <item name="android:background">@drawable/actionbar_background</item>
        <item name="android:backgroundStacked">@drawable/actionbar_background</item>
        <item name="android:backgroundSplit">@drawable/actionbar_background</item>

        <!-- Support library compatibility -->
        <item name="titleTextStyle">@style/TitleTextStyle</item>
        <item name="background">@drawable/actionbar_background</item>
        <item name="backgroundStacked">@drawable/actionbar_background</item>
        <item name="backgroundSplit">@drawable/actionbar_background</item>
    </style>

    <!-- action bar title text -->
    <style name="TitleTextStyle"
           parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>

    <!-- action bar tab text -->
    <style name="TabTextStyle"
           parent="@style/Widget.AppCompat.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>
</resources>

Upvotes: 6

Blackbelt
Blackbelt

Reputation: 157437

If I have not misunderstand your issue, you can collapse it together this way

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:actionBarStyle">@style/ActionBarStyle</item>
    <item name="actionBarStyle">@style/ActionBarStyle</item>
</style>

<style name="ActionBarStyle" parent="@style/Widget.AppCompat.ActionBar">
    <item name="android:background">@drawable/bg_actionbar</item>
    <item name="background">@drawable/bg_actionbar</item>
</style>

In my experience, this way eclipse gives compile time errors every time you change somethings inside styles.xml (due of lint if I remember good), but clean and rebuild make those errors go away.

Upvotes: 2

Related Questions