How do I style a specific element with day and night theme?

Issue

I have an android app that makes use of some Material Card Views. In my styles.xml file, I am applying two types of styling for Material Card View;

• service.day, which shows a light background for theme.xml day.
• service.night, which shows a darker background for theme.xml night. ie battery saver.

"service", in context, just relates to the style's application in my app - a material card view which shows a single train service.

The Code:

Style.xml

<style name="service.day" parent="Widget.MaterialComponents.CardView" >
    <item name="cardBackgroundColor">#f4eada</item>
</style>
<style name="service.night" parent="Widget.MaterialComponents.CardView" >
    <item name="cardBackgroundColor">#444444</item>
</style>

And the following is placed in my theme files under the default "base application theme" code.

Theme.xml

<item name="materialCardViewStyle">@style/service.day</item>

Theme.xml (Night)

<item name="materialCardViewStyle">@style/service.night</item>

The above will apply that styling to all material card views in my app.

What I am looking for, is to keep one set of material card views as above styling, but implement a second set of card styles for a different part of the app.

Solution

Based on your comment above

You can inherit as you like by using the service.day or service.night as the parent theme. That would mean something like make a theme say xyz, extend the properties of your theme(which in turn extends the properties of the default theme of Android) and then customise it accordingly.

Let me explain it with an example

Put something like this in the values/themes.xml file

<style name = "service.day.CustomCardTheme1" parent="service.day">
<!--Your new attributes here, Note that this will retain the property defined in the parent that is your background-->
</style>

And a similar night value in values-night/themes.xml file

<style name = "service.day.CustomCardTheme1" parent="service.day">
<!--Your new attributes here, Note that this will retain the property defined in the parent that is your background-->
</style>

You can keep creating your own CustomCardTheme say n any number of times with this inheritance and give it all the own colors and properties you like, just within the scope of the Widget.MaterialComponents.CardView style

Answered By - gtxtreme