如何使用 Jetpack Compose 在 TopAppBar 中设置渐变背景

Question

我想设置我的TopAppBar的渐变背景：

我的代码：

TopAppBar(
    modifier = Modifier.background(
        Brush.horizontalGradient(
            colors = listOf(
                Color.Red,
                Color.Green
            )
        )
    ),
    title = { Text("UI Components") },
    backgroundColor = Color.Transparent
)

结果：

我发现了这篇文章：Jetpack Compose Button with gradient background? for button - 所以我通过修饰符设置了 backgroundColor 透明和自定义背景。可悲的是，在我的情况下，文本周围有一个额外的阴影，我不知道如何删除。我应该改变什么，或者 TopAppBar 可能不是为使用渐变而设计的，我应该编写一些完全自定义的东西？

Answer 1

这个阴影是默认elevation造成的。将其设置为零：

TopAppBar(
    modifier = Modifier.background(
        Brush.horizontalGradient(
            colors = listOf(
                Color.Red,
                Color.Green
            )
        )
    ),
    title = { Text("UI Components") },
    backgroundColor = Color.Transparent,
    elevation = 0.dp
)