Jetpack Compose 中的暗模式：如何禁用并强制使用浅色主题？

2024-03-20 21:49:23

禁用 Jetpack Compose 中的 Darktheme

前言

Jetpack Compose 是一个强大的 Android UI 框架，它默认支持暗模式。然而，在某些情况下，你可能需要禁用暗模式，特别是在开发的早期阶段。本文将指导你如何通过 Jetpack Compose 在 Android 应用中禁用暗模式，并强制使用浅色主题。

禁用暗模式的步骤

1. 创建自定义主题

首先，你需要创建一个自定义主题来覆盖默认主题。这将允许你定义自己的颜色、字体和样式。以下示例创建了一个名为 LightAppTheme 的浅色主题：

@Composable
fun LightAppTheme(content: @Composable() () -> Unit) {
    val colors = lightColors(
        primary = Color.Black,
        secondary = Color.Blue,
        background = Color.White,
        surface = Color.White,
        onPrimary = Color.White,
        onSecondary = Color.White,
        onBackground = Color.Black,
        onSurface = Color.Black
    )
    CompositionLocalProvider(LocalContentColor provides colors.onBackground) {
        MaterialTheme(colors = colors, content = content)
    }
}

2. 使用自定义主题

在应用的入口点 MainActivity.kt 中，使用自定义主题包装你的内容：

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContent {
        LightAppTheme {
            MyApp()
        }
    }
}

3. 强制使用浅色模式

要强制使用浅色模式，请在 AndroidManifest.xml 文件中设置 forceLight 标志：

<application
    android:name=".MyApp"
    android:forceDarkAllow="false"
    ...
    />

示例代码

完整的示例代码如下：

package com.example.myapp

import android.app.Application
import androidx.compose.material.lightColors
import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color

class MyApp : Application() {

    override fun onCreate() {
        super.onCreate()
    }
}

@Composable
fun LightAppTheme(content: @Composable() () -> Unit) {
    val colors = lightColors(
        primary = Color.Black,
        secondary = Color.Blue,
        background = Color.White,
        surface = Color.White,
        onPrimary = Color.White,
        onSecondary = Color.White,
        onBackground = Color.Black,
        onSurface = Color.Black
    )
    CompositionLocalProvider(LocalContentColor provides colors.onBackground) {
        MaterialTheme(colors = colors, content = content)
    }
}