Define different themable styles to the same widget types

Question

I would like to define different themable styles for Android widget. In example below there are two ImageView widgets, where one is using my 'theme' style and another is manualy styled. I wish to implement config files in a way that I coluld ommit 'base_theme' prefix so it could be determined automatically based on activity theme configuration.

Documentation on writing themes mentions how to change style for all ImageViews or Buttons, not for particular ones with style attribute. I figured out that it is possible to solve my problem by using stylable custom components but I think there is some better way to solve my problem.

base_style.xml

<style name="base_theme" parent="android:Theme.NoTitleBar">
</style>

<style name="base_theme.event_list_filter">
    <item name="android:orientation">horizontal</item>
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_margin">10dp</item>
    <item name="android:background">@drawable/base_white_rounded</item>
</style>

<style name="base_theme.base_event_list_filter_image">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:padding">10dp</item>
    <item name="android:background">@drawable/vr_black_border</item>
</style>

<style name="base_theme.base_event_list_scrollable">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">0dp</item>
    <item name="android:layout_weight">1</item>
    <item name="android:background">@drawable/base_white_rounded</item>
</style>

<style name="base_theme.base_event_list_table">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">fill_parent</item>
</style>

activity_layout.xml

<LinearLayout style="@style/base_theme.base_event_list_filter" >
    <ImageView
        style="@style/base_theme.base_event_list_filter_image"
        android:src="@drawable/pic0" />

    <ImageView
        ...
        android:src="@drawable/pic1" />
</LinearLayout>

Thanks for help,
Maciek

Answer 1

I have found a solution. I hope it will help someone with similar theming problem.

First of all I have added new attributes to my base_theme, and then I have configured them in following way:

base_style.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <!-- add attributes to your theme -->s
    <declare-styleable name="base_theme">
        <attr name="event_list_filter" format="reference" />
        <attr name="pic0" format="reference" />
    </declare-styleable>

    <!-- fill attributes with your own styles/drawables/etc -->
    <style name="base_theme" parent="android:Theme.NoTitleBar">
        <item name="event_list_filter">@style/base_theme.event_list_filter_image</item>
        <item name="pic0">@drawable/base_theme.pic0</item>
    </style>

        <!-- define corresponding resource -->
    <style name="base_theme.base_event_list_filter_image">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:padding">10dp</item>
        <item name="android:background">@drawable/vr_black_border</item>
    </style>

    <drawable name="base_theme.pic0">@drawable/base_pic0</drawable>

</resources>

Another layout steel_styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <!-- fill attributes with your own styles/drawables/etc -->
    <style name="steel_theme" parent="@style/base_theme">
        <item name="pic0">@drawable/steel_theme.pic0</item>
    </style>

    <drawable name="steel_theme.pic0">@drawable/steel_pic0</drawable>

</resources>

Activity layout file activity_layout.xml

...
<ImageView
    style="?attr/event_list_filter_image"
    android:src="?attr/pic0" />
...

With such configuration pic0 will be different on the screen based on theme set for activity in AndroidManifest.xml.