Animate start FAB icon spin on tap

V2rayNG/app/src/main/java/com/v2ray/ang/ui/main/MainBottomBar.kt

@@ -1,5 +1,7 @@
 package com.v2ray.ang.ui.main
 
+import androidx.compose.animation.core.Animatable
+import androidx.compose.animation.core.tween
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
@@ -20,9 +22,13 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.contentDescription
@@ -33,6 +39,7 @@ import com.v2ray.ang.ui.compose.AppDivider
 import com.v2ray.ang.ui.compose.colorFabActive
 import com.v2ray.ang.ui.compose.colorFabInactiveDark
 import com.v2ray.ang.ui.compose.colorFabInactiveLight
+import kotlinx.coroutines.launch
 
 @Composable
 fun MainBottomBar(
@@ -41,6 +48,15 @@ fun MainBottomBar(
     isDarkTheme: Boolean,
     onAction: (MainAction) -> Unit
 ) {
+    val scope = rememberCoroutineScope()
+    val rotationAnim = remember { Animatable(0f) }
+
+    LaunchedEffect(isRunning) {
+        if (!isRunning) {
+            rotationAnim.snapTo(0f)
+        }
+    }
+
     Box(modifier = Modifier.fillMaxWidth()) {
         Column(
             modifier = Modifier
@@ -68,7 +84,17 @@ fun MainBottomBar(
             }
         }
         FloatingActionButton(
-            onClick = { onAction(MainAction.ToggleService) },
+            onClick = {
+                if (!isRunning) {
+                    scope.launch {
+                        rotationAnim.animateTo(
+                            targetValue = 720f,
+                            animationSpec = tween(durationMillis = 3000)
+                        )
+                    }
+                }
+                onAction(MainAction.ToggleService)
+            },
             modifier = Modifier
                 .align(Alignment.TopEnd)
                 .padding(end = 24.dp)
@@ -85,7 +111,9 @@ fun MainBottomBar(
                     if (isRunning) R.string.acc_stop else R.string.acc_start
                 ),
                 tint = Color.White,
-                modifier = Modifier.size(24.dp)
+                modifier = Modifier
+                    .size(24.dp)
+                    .graphicsLayer { rotationZ = rotationAnim.value }
             )
         }
     }