如何更改jetpack compose中的状态栏颜色？

Question

如何使状态栏颜色在 compose 中透明，如下所示：

它有相同的颜色，但有一点阴影。

Answer 1

第 1 步（添加依赖项）=> 版本可能会更改

implementation "com.google.accompanist:accompanist-systemuicontroller:0.27.0"

步骤 2 => 在 Theme.kt 文件中

根据您的需要在下面的功能中更改颜色。

val systemUiController = rememberSystemUiController()
if(darkTheme){
    systemUiController.setSystemBarsColor(
        color = Color.Transparent
    )
}else{
    systemUiController.setSystemBarsColor(
        color = Color.White
    )
}

步骤 3 => 在systemUiController上，您可以访问应用程序所需的所有类型的自定义设置。上面是setSystemBarsColor的示例

Answer 2

Google 刚刚创建了一个名为accompanist.
你可以在这里找到它：https : //github.com/google/accompanist

它包含多个有用的 Jetpack Compose 库，其中包括一个系统 UI 控制器，您可以使用它来更改状态栏颜色。

文档- https://google.github.io/accompanist/systemuicontroller/

Answer 3

我认为其他答案是想太多了 - 除非你真的想在源代码中动态更改状态栏颜色。

只需检查您的 src/main/res/values-night/themes.xml

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.HelloWorld" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        ...
        <item name="colorPrimaryVariant">@color/black</item>
        ...

        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
    </style>
</resources>

Answer 4

这是我的解决方案，没有伴奏，而且非常简单。一切都在主题定义中完成。这是创建新的 compose 项目时出现的标准代码，但添加了中间的块：

@Composable
fun JtxBoardTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    // Dynamic color is available on Android 12+
    dynamicColor: Boolean = true,
    content: @Composable () -> Unit
) {
    val colorScheme = when {
        dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
            val context = LocalContext.current
            if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
        }
        darkTheme -> DarkColorScheme
        else -> LightColorScheme
    }

    val view = LocalView.current
    if (!view.isInEditMode) {
        SideEffect {
            val activity  = view.context as Activity
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
                activity.window.navigationBarColor = colorScheme.primary.copy(alpha = 0.08f).compositeOver(colorScheme.surface.copy()).toArgb()
                activity.window.statusBarColor = colorScheme.background.toArgb()
                WindowCompat.getInsetsController(activity.window, view).isAppearanceLightStatusBars = !darkTheme
                WindowCompat.getInsetsController(activity.window, view).isAppearanceLightNavigationBars = !darkTheme
            }
        }
    }

    MaterialTheme(
        colorScheme = colorScheme,
        typography = Typography,
        content = content
    )
}

我正在状态栏和导航栏上应用颜色。导航栏的颜色是这样计算的，因为我想使用与底部应用程序栏相同的颜色（其高度为 2，这意味着主色的颜色叠加为 8%）。

            WindowCompat.getInsetsController(activity.window, view).isAppearanceLightStatusBars = !darkTheme
            WindowCompat.getInsetsController(activity.window, view).isAppearanceLightNavigationBars = !darkTheme

这两行负责导航和状态栏中的图标。由于 WindowCompat.getInsetsController(activity.window, view).isAppearanceLightNavigationBars = !darkTheme 仅在 Android API 级别 26 (O) 中可用，因此我将整个块限制为该版本。如果您只想要状态栏的颜色，那么您也可以转到最低 API 级别 23 (M)。

我对计算导航栏颜色的方式不满意，但这是也适用于动态颜色的最佳方式。

Answer 5

喷气背包材料3

这是您需要修改的theme.kt文件。

[我注释掉了需要修改的地方]

@Composable
fun WellnessTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    // Dynamic color is available on Android 12+
    dynamicColor: Boolean = true,
    content: @Composable () -> Unit
) {
    val colorScheme = when {
      dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
        val context = LocalContext.current
        if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
      }
      darkTheme -> DarkColorScheme
      else -> LightColorScheme
    }
    val view = LocalView.current
    if (!view.isInEditMode) {
      SideEffect {
          val window = (view.context as Activity).window
          window.statusBarColor = colorScheme.background.toArgb() // here change the color
          window.navigationBarColor = colorScheme.background.toArgb() // here change the color

          // here change the status bar element color
          WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = !darkTheme
      }
    }

    MaterialTheme(
      colorScheme = colorScheme,
      typography = Typography,
      content = content
    )
}

Answer 6

简单的答案是：前往 MainActivity.kt，然后输入这些代码

WindowCompat.setDecorFitsSystemWindows(window, false)

这发生在之前

    setContent{}

然后前往您的值文件夹，打开colors.xml并创建

<color name="transparent">#00000000</color>

转到主题，打开themes.xml 和themes.xml(night) 并将此代码放入这两个文件中包含颜色的样式标签之一中。

<item name="android:statusBarColor" tools:targetApi="l">@color/transparent</item>

这就是在 Android 上创建透明状态栏的简单方法。

Answer 7

如果您对使用该库不感兴趣accompanist，可以将此代码写入您的composable函数中：

val activity = LocalView.current.context as Activity
val backgroundArgb = MaterialTheme.colors.background.toArgb()
activity.window.statusBarColor = backgroundArgb

另外，要更改状态栏图标颜色，您可以这样做：

val wic = WindowCompat.getInsetsController(window, window.decorView)
wic.isAppearanceLightStatusBars = false // Adapt it with your implementation

Answer 8

我使用了在 Jetpack Compose 示例中找到的这段代码。这对我来说可以。只需根据自己的喜好进行调整。

@Composable
fun SystemUi(windows: Window) =
    MaterialTheme {
        windows.statusBarColor = MaterialTheme.colors.surface.toArgb()
        windows.navigationBarColor = MaterialTheme.colors.surface.toArgb()

        @Suppress("DEPRECATION")
        if (MaterialTheme.colors.surface.luminance() > 0.5f) {
            windows.decorView.systemUiVisibility = windows.decorView.systemUiVisibility or
                    View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR
        }

        @Suppress("DEPRECATION")
        if (MaterialTheme.colors.surface.luminance() > 0.5f) {
            windows.decorView.systemUiVisibility = windows.decorView.systemUiVisibility or
                    View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR
        }
    }

Answer 9

稍微修改@Patrik Lang，您可以在任何函数中使用它@Composable：

@Composable
fun StatusBarColor(color: Color) {
    val view = LocalView.current
    val darkTheme = isSystemInDarkTheme()

    if (!view.isInEditMode) {
        SideEffect {
            val window = (view.context as Activity).window
            window.statusBarColor = color.toArgb()
            WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = !darkTheme
            WindowCompat.getInsetsController(window, view).isAppearanceLightNavigationBars = !darkTheme
        }
    }
}

Answer 10

只需采用老式的方式并将其添加到 themes.xml 中：

<item name="android:windowTranslucentStatus">true</item>