Compose の LottieAnimation でクリックしたときにアニメーションさせる

rememberLottieAnimatable を使います。

view plainprint?

1. @Preview  
2. @Composable  
3. fun LottieAnimationSample() {  
4.     val composition by rememberLottieComposition(  
5.         LottieCompositionSpec.RawRes(R.raw.lottie_animation)  
6.     )  
7.     val lottieAnimatable = rememberLottieAnimatable()  
8.     val coroutineScope = rememberCoroutineScope()  
9.   
10.     Box(  
11.         contentAlignment = Alignment.Center,  
12.         modifier = Modifier  
13.             .fillMaxSize()  
14.             .pointerInput(Unit) {  
15.                 detectTapGestures(  
16.                     onTap = {  
17.                         coroutineScope.launch {  
18.                             lottieAnimatable.animate(composition)  
19.                         }  
20.                     },  
21.                 )  
22.             }  
23.     ) {  
24.         LottieAnimation(  
25.             composition = composition,  
26.             progress = { lottieAnimatable.value },  
27.             modifier = Modifier.size(72.dp),  
28.         )  
29.     }  
30. }    

@Preview @Composable fun LottieAnimationSample() { val composition by rememberLottieComposition( LottieCompositionSpec.RawRes(R.raw.lottie_animation) ) val lottieAnimatable = rememberLottieAnimatable() val coroutineScope = rememberCoroutineScope() Box( contentAlignment = Alignment.Center, modifier = Modifier .fillMaxSize() .pointerInput(Unit) { detectTapGestures( onTap = { coroutineScope.launch { lottieAnimatable.animate(composition) } }, ) } ) { LottieAnimation( composition = composition, progress = { lottieAnimatable.value }, modifier = Modifier.size(72.dp), ) } }