独自のThemeを作るときの注意点

色とか全体にRippleの指定とかしたい時にThemeを作るけどもComposableの順で指定したRippleが消えたので注意点。

@Composable
fun MyTheme(
    themeType: ThemeType,
    content: @Composable () -> Unit,
) {
    val color = themeType.colorPalette
    CompositionLocalProvider(
        localMyColors provides color,
        LocalRippleTheme provides MyRippleTheme
    ) {
        MaterialTheme {
            content()
        }
    }
}

こうするとMaterialThemeのなかでLocalRippleThemeを上書きしてしまい、せっかく指定したMyRippleThemeが効かなくなる

正しくはこうする

@Composable
fun MyTheme(
    themeType: ThemeType,
    content: @Composable () -> Unit,
) {
    val color = themeType.colorPalette
    MaterialTheme {
        CompositionLocalProvider(
            localMyColors provides color,
            LocalRippleTheme provides MyRippleTheme
        ) {
            content()
        }
    }
}