Badgesanimated

Scanning

A verification chip with a bright line that scans vertically across it.

Scanning…

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

val t = rememberInfiniteTransition(label = "scan")
val y by t.animateFloat(
    initialValue = -1f,
    targetValue = 1f,
    animationSpec = infiniteRepeatable(tween(1400, easing = LinearEasing)),
    label = "y",
)
val cyan = Color(0xFF06B6D4)
Box(
    Modifier
        .clip(RoundedCornerShape(8.dp))
        .background(Color(0xFF0E1B22))
        .drawWithContent {
            drawContent()
            val cy = size.height / 2 + y * size.height / 2
            drawRect(
                brush = Brush.verticalGradient(
                    0f to Color.Transparent,
                    0.5f to cyan.copy(alpha = 0.7f),
                    1f to Color.Transparent,
                ),
                topLeft = Offset(0f, cy - 6f),
                size = Size(size.width, 12f),
            )
        },
) {
    Text(
        "Scanning…",
        Modifier.padding(horizontal = 12.dp, vertical = 4.dp),
        color = cyan,
        fontSize = 12.sp,
        fontFamily = FontFamily.Monospace,
    )
}