如何在Jetpack组合中创建角梯度？

Question

​

​

我想在中创建这样的角度渐变。

​

​

渐变是在Figma中生成的，下面是Figma检查中的android代码。

​

​

只有one angle，我才能找到线性梯度的资源。

如何在Jetpack构图中创建这个角度梯度？

Answer 1

您需要的是Brush.sweepGradient与colorStops和正确设置中心。渐变停止从3'o时钟开始，右中心，所以您需要在每个停止加上0.25，并移动那些通过1开始，我移动2颜色从底部到顶部0.01，和0.14

@Composable
private fun SweepGradientExample() {
    val colorStops = listOf(
        0.01f to Color(0x8C1339FF),
        0.14f to Color(0x8CFF13A1),
        0.31f to Color(0x8C1380FF),
        0.54f to Color(0x8CD013FF),
        0.81f to Color(0x8C7B13FF),
    ).toTypedArray()

    val density = LocalDensity.current
    val centerX: Float
    val centerY: Float
    with(density) {
        centerX = 161.dp.toPx() / 2
        centerY = 97.dp.toPx() / 2
    }
    val brush = Brush.sweepGradient(
        colorStops = colorStops,
        center = Offset(centerX, centerY)
    )
    Box(modifier = Modifier
        .size(width = 161.dp, height = 97.dp)
        .background(brush)
    )
}

结果

​

​