Badgesanimated

Gift shake

A reward chip whose gift box rattles, then pops a sparkle to claim.

Claim reward

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 = "gift")
val angle by t.animateFloat(
    initialValue = 0f,
    targetValue = 0f,
    animationSpec = infiniteRepeatable(
        keyframes {
            durationMillis = 2200
            0f at 0
            (-8f) at 1500
            8f at 1620
            (-6f) at 1740
            0f at 1880
        },
    ),
    label = "angle",
)
Surface(
    shape = RoundedCornerShape(50),
    color = Color(0xFFEC4899).copy(alpha = 0.14f),
    contentColor = Color(0xFFBE185D),
) {
    Row(
        Modifier.padding(horizontal = 10.dp, vertical = 4.dp),
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.spacedBy(6.dp),
    ) {
        Icon(
            Icons.Filled.CardGiftcard,
            contentDescription = null,
            modifier = Modifier.size(15.dp).graphicsLayer { rotationZ = angle },
        )
        Text("Claim reward", fontSize = 12.sp, fontWeight = FontWeight.SemiBold)
    }
}