With M2 theme, at some point I had this kind of co...

# compose

[Stylianos Gakis]

With M2 theme, at some point I had this kind of code

val someColor = if (MaterialTheme.colors.isLight) {
  MaterialTheme.colors.primary
} else {
  MaterialTheme.colors.secondary
},

But in m3, MaterialTheme.colorScheme.isLight doesn’t exist anymore. Is there some other way I can get this information straight from the MaterialTheme object?

[Stylianos Gakis]

I guess I have to go with isSystemInDarkMode() directly and assume that my MaterialTheme is actually following whatever that returned. But it may not be the case, as I may have overwritten that for some small part of the UI or whatever 🤔

[Ian Lake]

There was some good points on the issue: https://issuetracker.google.com/issues/208860800#comment7

[Stylianos Gakis]

Yeah good points indeed. Thanks a lot for bringing this to my attention!
This does make it less convenient, as previously I’d simply add an extension function on (m2)Colors and call that like MaterialTheme.colors.customThing. But I think I understand the reasoning behind it.

I ended up doing basically this, for someone else to see if they encounter the same issue (AppName as a way to identify these are custom, in my case those are all just “Hedvig”):

internal val LocalAppNameMaterial3ColorScheme = staticCompositionLocalOf<AppNameMaterial3ColorScheme> {
  error("AppNameMaterial3ColorScheme not provided")
}

class AppNameMaterial3ColorScheme(
  val containedButtonContainer: Color,
  val onContainedButtonContainer: Color,
)

internal fun darkAppNameColorScheme(
  colorScheme: ColorScheme,
) = AppNameMaterial3ColorScheme(
  containedButtonContainer = colorScheme.tertiary,
  onContainedButtonContainer = colorScheme.onTertiary,
)

internal fun lightAppNameColorScheme(
  colorScheme: ColorScheme,
) = AppNameMaterial3ColorScheme(
  containedButtonContainer = colorScheme.primary,
  onContainedButtonContainer = colorScheme.onPrimary,
)

inside my AppTheme, create it:

val (colorScheme, appNameColorTheme) = when {
  darkTheme -> DarkColorScheme to darkAppNameColorScheme(DarkColorScheme)
  else -> LightColorScheme to lightAppNameColorScheme(LightColorScheme)
}

And pass it down through a local inside my AppTheme composable

LocalHedvigMaterial3ColorScheme provides appNameColorTheme,

And finally add this to my colorScheme so that it’s convenient to use, just like I would any other item from inside colorScheme

val ColorScheme.containedButtonContainer: Color
  @Composable
  get() = LocalAppNameMaterial3ColorScheme.current.containedButtonContainer

val ColorScheme.onContainedButtonContainer: Color
  @Composable
  get() = LocalAppNameMaterial3ColorScheme.current.onContainedButtonContainer

Where it’s an extension on ColorScheme, simply to not make this look odd from all the other cases, now can just call MaterialTheme.colorScheme.containedButtonContainer.