【Jetpack Compose】アプリ全体のテキスト色を一括で変更する方法

Androidアプリでアプリ全体のテキスト色を指定する際、非Jetpack Compose環境ではない従来の方法では、アプリのテーマに「android:textColor」属性を指定することでアプリ全体のテキスト色を指定できました。

しかし、Jetpack Composeを使ったアプリ開発では、原則としてスタイルXMLは使用しないためこの方法は使えません。
また、アプリに使用する色を定めるdarkColorSchemeやlightColorSchemeでも、テキスト色を直接指定する部分がないため使い方がややこしくなります。

そのため、アプリ全体のテキスト色を一括で指定するには、以下のようにMaterialThemeにてProvideTextStyleを使って行う方が簡単です。

以下、端末の設定がダークモードかどうかで全体的なテキスト色を変更するコード例です。

//--- 自動生成されるTheme.kt

// モード毎のテキスト色を定義
val textColorInDarkMode = Color(0xffffffff)
val textColorInLightMode = Color(0xff000000)


@Composable
fun MyApp_JetpackComposeTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    // Dynamic color is available on Android 12+
    dynamicColor: Boolean = true,
    content: @Composable () -> Unit
) {

    ・・・

    MaterialTheme(
        colorScheme = colorScheme,
        typoGraphy = Typography,
        content = {
            ProvideTextStyle(
                value = TextStyle(color = if (darkTheme) textColorInDarkMode else textColorInLightMode),
                content = content
            )
        }
    )
}

上記のように、予め使いたいテキスト色を定義しておきつつ、Jetpack Composeのテンプレートで自動生成されるTheme.kt内にあるMaterialThemeのcontent部分にて、表示したいcontentをProvideTextStyleで囲むような記述にすることで、MyApp_JetpackComposeThemeの下でcomposeされるテキストの色が一括で変更できます。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です