https://kotlinlang.org logo
#compose
Title
# compose
p

Piotr Prus

03/12/2024, 8:02 PM
I am trying to animate the SweepGradientShader that is used in
drawRoundRect
in a way that the color follow the path. I would like to change the starting point maybe, but there is no property like startAngle/endAngle. Any ideas? Example in the thread 🧵
As you can see here, i am animating the sweepgradient, but only until 1f
Copy code
val strokeWidthPx = with(density) { 2.dp.toPx() }
val blurPx = with(density) { 4.dp.toPx() }
val center = with(density) {
    Offset(dpSize.width.toPx() / 2, dpSize.height.toPx() / 2)
}
val lightPaint = remember(phase) {
    Paint().asFrameworkPaint().apply {
        this.maskFilter = BlurMaskFilter(blurPx, BlurMaskFilter.Blur.NORMAL)
        style = android.graphics.Paint.Style.STROKE
        blendMode = android.graphics.BlendMode.SOFT_LIGHT
        isAntiAlias = true
        strokeWidth = strokeWidthPx
        shader = SweepGradientShader(
            center = center,
            colors = listOf(
                Color.Transparent,
                Color.Transparent,
                Color.White.copy(alpha = 0.5f),
                Color.White,
                Color.White,
                Color.White.copy(alpha = 0.5f),
                Color.Transparent,
                Color.Transparent
            ),
            colorStops = listOf(
                (0f + phase).adjustToRange(),
                (0.40f + phase).adjustToRange(),
                (0.50f + phase).adjustToRange(),
                (0.6f + phase).adjustToRange(),
                (0.70f + phase).adjustToRange(),
                (0.8f + phase).adjustToRange(),
                (0.91f + phase).adjustToRange(),
                (1f + phase).adjustToRange()
            )
        )
    }
}
The phase is the animatedFloat that goes from 0f to 1f and adjustToRange make sure the colorStops do not exit the <0, 1> range, so for value like 0.5f + 0.8f = 1.3f, it will reduce it to 0.3f This does not work 😞 . I know why, cause it does not correlate with list of colors, but I do not have idea how to make it work.