Iconsanimated

Mic listening

A microphone with a live equalizer that reacts while it's recording.

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 MicListening(recording: Boolean) {
    val t = rememberInfiniteTransition(label = "mic")
    Row(verticalAlignment = Alignment.CenterVertically) {
        Icon(Icons.Filled.Mic, "Recording", tint = if (recording) Color(0xFFE11D48) else LocalContentColor.current)
        if (recording) Row(
            Modifier.padding(start = 6.dp).height(20.dp),
            horizontalArrangement = Arrangement.spacedBy(3.dp),
            verticalAlignment = Alignment.CenterVertically,
        ) {
            repeat(4) { i ->
                val h by t.animateFloat(
                    0.3f, 1f,
                    infiniteRepeatable(tween(400, delayMillis = i * 120, easing = EaseInOut), RepeatMode.Reverse),
                    label = "bar$i",
                )
                Box(Modifier.width(3.dp).fillMaxHeight(h).background(LocalContentColor.current, CircleShape))
            }
        }
    }
}