Material You - Incorrect colours

[gcantoni]

Hello,

Material You theme is not using the correct colours.

The status bar doesn’t look as it should, and the background colors of the app and the cards are incorrect.

To get the correct colours you should use the following theme

<style name="Theme.Example" parent="Theme.Material3.Light.NoActionBar"> <item name="colorPrimary">@color/md_theme_primary</item> <item name="colorOnPrimary">@color/md_theme_onPrimary</item> <item name="colorPrimaryContainer">@color/md_theme_primaryContainer</item> <item name="colorOnPrimaryContainer">@color/md_theme_onPrimaryContainer</item> <item name="colorSecondary">@color/md_theme_secondary</item> <item name="colorOnSecondary">@color/md_theme_onSecondary</item> <item name="colorSecondaryContainer">@color/md_theme_secondaryContainer</item> <item name="colorOnSecondaryContainer">@color/md_theme_onSecondaryContainer</item> <item name="colorTertiary">@color/md_theme_tertiary</item> <item name="colorOnTertiary">@color/md_theme_onTertiary</item> <item name="colorTertiaryContainer">@color/md_theme_tertiaryContainer</item> <item name="colorOnTertiaryContainer">@color/md_theme_onTertiaryContainer</item> <item name="colorError">@color/md_theme_error</item> <item name="colorOnError">@color/md_theme_onError</item> <item name="colorErrorContainer">@color/md_theme_errorContainer</item> <item name="colorOnErrorContainer">@color/md_theme_onErrorContainer</item> <item name="android:colorBackground">@color/md_theme_background</item> <item name="colorOnBackground">@color/md_theme_onBackground</item> <item name="colorSurface">@color/md_theme_surface</item> <item name="colorOnSurface">@color/md_theme_onSurface</item> <item name="colorSurfaceVariant">@color/md_theme_surfaceVariant</item> <item name="colorOnSurfaceVariant">@color/md_theme_onSurfaceVariant</item> <item name="colorOutline">@color/md_theme_outline</item> <item name="colorSurfaceInverse">@color/md_theme_inverseSurface</item> <item name="colorOnSurfaceInverse">@color/md_theme_inverseOnSurface</item> <item name="colorPrimaryInverse">@color/md_theme_inversePrimary</item> <item name="android:windowLightNavigationBar" tools:targetApi="27">true</item> <item name="android:windowLightStatusBar">true</item> </style>

You can use the official Google tool to generate the palette which is available at https://material-foundation.github.io/material-theme-builder/

At the same time the app is not using the new material you switches.

Just add this to your gradle

implementation 'com.google.android.material:material:1.12.0'

And use com.google.android.material.materialswitch.MaterialSwitch

Looking forward to these changes.

If you need an help for a quick implementation feel free to email me.

Best regards

[d4rken]

You can use the official Google tool to generate the palette which is available at https://material-foundation.github.io/material-theme-builder/

That's where the current theme assignments are from.

The status bar doesn’t look as it should, and the background colors of the app and the cards are incorrect.

I don't think this can be fixed just via themes.xml assignments, this might be fixed by #1469

At the same time the app is not using the new material you switches.

Can you give me an example? I'm already using MaterialSwitch

implementation 'com.google.android.material:material:1.12.0'

That's already being used (well v1.11, but I don't think that matters here).

Hm, this seems all a bit "just do this" hand waving 🙁