Chartsanimated

Radial bars

A circular bar chart whose spokes draw outward from a shared center hub.

Installation

caveui components are copy-paste Jetpack Compose built entirely on Material 3 — there's no caveui dependency to add. Make sure Material 3 is on your classpath (it ships with the Compose BOM), then copy the Usage snippet below into your project.

kotlin

// build.gradle.kts (module)
dependencies {
    implementation(platform("androidx.compose:compose-bom:2025.06.00"))
    implementation("androidx.compose.material3:material3")
}

Usage

kotlin

@Composable
fun RadialBars(
    values: List<Float> = listOf(0.9f, 0.7f, 0.85f, 0.5f, 0.75f, 0.6f, 0.95f, 0.55f),
    accent: Color = Color(0xFF8B5CF6),
    modifier: Modifier = Modifier,
) {
    val grow by animateFloatAsState(1f, tween(1000, easing = EaseOutCubic), label = "g")
    Canvas(modifier.size(150.dp)) {
        val n = values.size
        val inner = size.minDimension * 0.16f
        val maxLen = size.minDimension * 0.34f
        values.forEachIndexed { i, v ->
            val a = (-PI / 2 + i * 2 * PI / n).toFloat()
            val dir = Offset(cos(a), sin(a))
            val s = center + dir * inner
            val e = center + dir * (inner + maxLen * v * grow)
            drawLine(accent, s, e, 7.dp.toPx(), cap = StrokeCap.Round)
        }
    }
}