清理空的 Jetpack Compose 应用程序模板

对于纯 Jetpack Compose 应用程序，从技术上讲，我们不再需要用于 Android View 系统的themes.xmland 。colors.xml

但是，我已经看到很多代码仍然具有这些themes.xml并已colors.xml定义。就个人而言，我会删除它们以避免重复或混淆。

1.删​​除themes.xml和colors.xml

删除themes.xml并colors.xml可能导致编译错误，因为它仍然从AndroidManifest.xml. 你需要修改AndroidManifest.xml

android:theme="@style/Theme.EmptyComposeApp"在两者中删除和

<application
    ...
    android:theme="@style/Theme.EmptyComposeApp">
    <activity
        ...
        android:theme="@style/Theme.EmptyComposeApp">
        ...
    </activity>
</application>

替换为android:theme="@android:style/Theme.Material.Light.NoActionBar"in which 是您的themes.xml.

<application
    ...
    android:theme="@android:style/Theme.Material.Light.NoActionBar">
    ...
</application>

创建一个没有顶部操作栏的应用程序。可以使用Scaffold可组合功能创建顶部操作栏。在这个简单的 LazyColumn 应用程序中查看这个添加顶部应用程序栏示例。

我确实尝试不添加它android:theme=“@android:style/Theme.Material.Light.NoActionBar”，但ComponentActivity()默认情况下会创建顶部操作栏，我不知道使用 Jetpack Compose 摆脱它。

2. 使用 Compose 设置状态栏颜色

好吧，该应用程序可以运行，但是状态栏中的默认紫色消失了。

如果您查看原始文件themes.xml，它会在那里设置状态栏颜色。

<resources>
    <style name="Theme.EmptyComposeApp" parent="android:Theme.Material.Light.NoActionBar">
        <item name="android:statusBarColor">@color/purple_700</item>
    </style>
</resources>

由于这已被删除，我们需要在 Jetpack Compose 中实现它。为此，我们需要使用 Accompanist 的System UI Controller。

添加com.google.accompanist:accompanist-systemuicontroller库：

dependencies {
    ...
    implementation "com.google.accompanist:accompanist-systemuicontroller:0.24.1-alpha"
    ...
}

在ui\Theme\Theme.kt中，添加这个来设置purple_700颜色，这也是primaryVariant颜色

val systemUiController = rememberSystemUiController()
systemUiController.setStatusBarColor(
    color = colors.primaryVariant
)

完整的代码如下所示：

fun EmptyComposeAppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {
    val colors = if (darkTheme) {
        DarkColorPalette
    } else {
        LightColorPalette
    }

    val systemUiController = rememberSystemUiController()
    systemUiController.setStatusBarColor(
        color = colors.primaryVariant
    )

    MaterialTheme(
        colors = colors,
        typography = Typography,
        shapes = Shapes,
        content = content
    )
}

Android Studio 的模板项目没有设置导航栏颜色。因此，我们没有在上面的示例中设置它们。但是，我们通常希望为导航栏和状态栏设置相同的颜色。在这种情况下，您可以使用systemUiController.setSystemBarsColor()：

val systemUiController = rememberSystemUiController()
systemUiController.setSystemBarsColor(
    color = colors.primaryVariant
)

由于我想将此示例用作我自己的模板项目。我将更改它以systemUiController.setSystemBarsColor()在此应用示例中使用。

预览未渲染

使用系统 UI 控制器时存在预览无法正常工作的错误。在此处查看问题跟踪器。

java.lang.IllegalArgumentException: The Compose View must be hosted in an Activity with a Window!

要解决此问题，您需要通过传入useSystemUIController参数来禁用预览中的系统 UI 控制器。

在Theme.kt：

@Composable  
fun EmptyComposeAppTheme(  
  ...  
  useSystemUIController: Boolean = true,  
  ...
) {  
    ...
    if (useSystemUIController) {  
        val systemUiController = rememberSystemUiController()  
        systemUiController.setStatusBarColor(  
            color = colors.primaryVariant)  
    }  
    ...
}

在MainActivity.kt：

@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
    EmptyComposeAppTheme(useSystemUIController = false) {
        ...
    }
}

概括

现在我只有strings.xml在我的资源文件夹中。酷，不是吗？

我可能还会将此作为任何 Jetpack Compose 项目的起点。

最后

由于篇幅有限，这里以图片的形式给大家展示一小部分，需要Android jetpack的可以点击文末卡片免费领取。