improvement(UI): Use M3 defaultEffectsSpec for color state animations

Author: AChep

common/src/androidMain/kotlin/com/artemchep/keyguard/android/BaseActivity.kt

@@ -11,6 +11,7 @@ import androidx.activity.compose.setContent
 import androidx.appcompat.app.AppCompatActivity
 import androidx.browser.customtabs.CustomTabsIntent
 import androidx.compose.animation.animateColorAsState
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.contentColorFor
 import androidx.compose.runtime.Composable
@@ -121,7 +122,10 @@ abstract class BaseActivity : AppCompatActivity(), DIAware {
         setContent {
             KeyguardTheme {
                 val containerColor = activityContainerColor()
-                val containerColorAnimatedState = animateColorAsState(containerColor)
+                val containerColorAnimatedState = animateColorAsState(
+                    targetValue = containerColor,
+                    animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+                )
                 val contentColor = activityContentColor(containerColorAnimatedState.value)
                 Surface(
                     modifier = Modifier.semantics {

common/src/androidMain/kotlin/com/artemchep/keyguard/android/sshagent/SshRequestActivity.kt

@@ -176,7 +176,10 @@ internal class SshRequestActivity : BaseActivity() {
             val initialY = 48.dp
             mutableStateOf(initialY)
         }
-        val dimColor by animateColorAsState(dimColorTarget)
+        val dimColor by animateColorAsState(
+            targetValue = dimColorTarget,
+            animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+        )
         val contentScale by animateFloatAsState(
             targetValue = contentScaleTarget,
             animationSpec = tween(durationMillis = 300),

common/src/commonMain/kotlin/com/artemchep/keyguard/feature/confirmation/ConfirmationScreen.kt

@@ -474,7 +474,10 @@ private fun ConfirmationFileItem(
             } else {
                 MaterialTheme.colorScheme.error
             }
-            val colorState = animateColorAsState(colorTarget)
+            val colorState = animateColorAsState(
+                targetValue = colorTarget,
+                animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+            )
             Icon(
                 imageVector = Icons.Outlined.AttachFile,
                 contentDescription = null,

common/src/commonMain/kotlin/com/artemchep/keyguard/feature/home/settings/SettingListScreen.kt

@@ -235,7 +235,10 @@ fun rememberSettingsItems(
 
                                     val targetTint =
                                         if (isPurchased) MaterialTheme.colorScheme.primary else LocalContentColor.current
-                                    val tint by animateColorAsState(targetValue = targetTint)
+                                    val tint by animateColorAsState(
+                                        targetValue = targetTint,
+                                        animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+                                    )
                                     Icon(
                                         Icons.Outlined.KeyguardPremium,
                                         null,

common/src/commonMain/kotlin/com/artemchep/keyguard/feature/home/vault/component/SearchTextField.kt

@@ -389,6 +389,7 @@ private fun Modifier.searchTextFieldBackground(
         val colorState =
             animateColorAsState(
                 targetValue = if (isHighlightedState.value) colorTarget else colorTarget.combineAlpha(0f),
+                animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
                 label = "SearchFieldBackground",
             )
 

common/src/commonMain/kotlin/com/artemchep/keyguard/feature/largetype/LargeTypeScreen.kt

@@ -181,7 +181,10 @@ private fun SymbolItem(
             MaterialTheme.colorScheme
                 .surfaceColorAtElevation(backgroundElevation)
         }
-        val backgroundColorState = animateColorAsState(targetBackgroundColor)
+        val backgroundColorState = animateColorAsState(
+            targetValue = targetBackgroundColor,
+            animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+        )
         Modifier
             .padding(2.dp)
             .clip(RoundedCornerShape(4.dp))

common/src/commonMain/kotlin/com/artemchep/keyguard/feature/yubikey/YubiKey.kt

@@ -91,7 +91,10 @@ fun YubiKeyUsbCard(
             )
             val colorTarget =
                 if (isActive) MaterialTheme.colorScheme.primary else LocalContentColor.current
-            val color by animateColorAsState(colorTarget)
+            val color by animateColorAsState(
+                targetValue = colorTarget,
+                animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+            )
             Icon(
                 Icons.Outlined.Usb,
                 modifier = Modifier

common/src/commonMain/kotlin/com/artemchep/keyguard/ui/TextItem.kt

@@ -936,6 +936,7 @@ private fun TextFieldLabel(
         .combineAlpha(HighEmphasisAlpha)
     val textColor by animateColorAsState(
         targetValue = if (expanded) expandedTextColor else normalTextColor,
+        animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
     )
 
     Text(
@@ -1485,7 +1486,10 @@ private fun FlatTextFieldSurface(
                 .combineAlpha(0.1f)
                 .compositeOver(MaterialTheme.colorScheme.surfaceVariant)
     }
-    val borderColor by animateColorAsState(targetValue = borderColorTarget)
+    val borderColor by animateColorAsState(
+        targetValue = borderColorTarget,
+        animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+    )
     val shape = surfaceShape(
         shapeState = shapeState,
         expressive = expressive,
@@ -1551,7 +1555,10 @@ fun FlatTextFieldBadge(
     text: String,
     icon: ImageVector? = null,
 ) {
-    val backgroundColorState = animateColorAsState(backgroundColor)
+    val backgroundColorState = animateColorAsState(
+        targetValue = backgroundColor,
+        animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+    )
     val contentColor = run {
         val color = if (backgroundColor.luminance() > 0.5f) {
             Color.Black
@@ -1561,7 +1568,10 @@ fun FlatTextFieldBadge(
         val tint = backgroundColor.copy(alpha = 0.1f)
         tint.compositeOver(color)
     }
-    val contentColorState = animateColorAsState(contentColor)
+    val contentColorState = animateColorAsState(
+        targetValue = contentColor,
+        animationSpec = MaterialTheme.motionScheme.defaultEffectsSpec(),
+    )
     Row(
         modifier = modifier
             .clip(MaterialTheme.shapes.small)