Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Use custom themes to modify style attributes

I want to create two themes, GrayTheme and RedTheme, that modify one style attribute. For example here are my two themes, default font color is white, which is fine for both themes:

<style name="RedTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:textColor">@color/white</item>
</style>

<style name="GrayTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:textColor">@color/white</item>
</style>

But I have a style that I use for Header TextViews. If I am using the RedTheme I want the style HeaderFont to have textColor red and if it is the GrayTheme I want the HeaderFont textColor to be gray, without me having to modify the individual xml files that access this HeaderFont style.

<style name="HeaderFont" parent="@android:style/TextAppearance.Medium">
    <item name="android:textColor">@color/gray</item>
</style>

I've been searching around looking for a graceful solution to this, but haven't been able to find anything. Ideas?

like image 803
Marc Avatar asked Apr 08 '15 20:04

Marc


People also ask

What are styles and themes on Android?

Styles and themes on Android allow you to separate the details of your app design from the UI structure and behavior, similar to stylesheets in web design. A style is a collection of attributes that specify the appearance for a single View . A style can specify attributes such as font color, font size, background color, and much more.

What are theme attributes and how to use them?

Knowing what theme attributes are available, equips you to use them when writing your layouts, styles or drawables. Using theme attributes makes it much easier to support theming (like dark theme) and to write more flexible, maintainable code. For a deep dive on this, join us in our next post in this series:

What is the best way to style an Android app?

The Android styling system offers a powerful way to specify your app's visual design, but it can be easy to misuse… Specifically we recommended using theme attributes to provide a point of indirection to resources, so that you can vary them (e.g. in dark theme ).

How to apply multiple styles to views inside the customview?

Apply multiple styles to CustomView via Theme. | by Alex Misiulia | AndroidPub | Medium Android. Apply multiple styles to CustomView via Theme. Today I will show you how to apply multiple styles to Views inside the CustomView. 1. Create CustomView 2. Create custom attributes for each component inside it 3.


Video Answer


1 Answers

After many failures of finding a clean solution I finally found an answer that works beautifully.

I created a custom attribute headerFontColor and added it to /res/values/attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <attr name="headerFontColor" format="reference|color" />
</resources>

Next, in the style for HeaderFont I added updated the textColor to be the new custom attribute (headerFontColor) instead of a specific color

<style name="HeaderFont" parent="@android:style/TextAppearance.Medium">
    <item name="android:textColor">?headerFontColor</item>
</style>

Now, I can simply set the headerFontColor attribute based on the theme

<style name="RedTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:textColor">@color/white</item>
    <item name="headerFontColor">@color/red</item>
</style>
<style name="GrayTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:textColor">@color/white</item>
    <item name="headerFontColor">@color/gray</item>
</style>

After doing this, all TextViews that use the HeaderFont style get updated with the headerFontColor just by switching the Theme

This solution guided me: Setting a color based on theme

like image 66
Marc Avatar answered Sep 23 '22 07:09

Marc