diff --git a/app/src/main/java/com/rosetta/messenger/ui/settings/ProfileScreen.kt b/app/src/main/java/com/rosetta/messenger/ui/settings/ProfileScreen.kt index f767a66..ee10245 100644 --- a/app/src/main/java/com/rosetta/messenger/ui/settings/ProfileScreen.kt +++ b/app/src/main/java/com/rosetta/messenger/ui/settings/ProfileScreen.kt @@ -11,6 +11,7 @@ import androidx.activity.result.contract.ActivityResultContracts import androidx.compose.animation.* import androidx.compose.animation.core.* import androidx.compose.foundation.* +import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.asPaddingValues @@ -27,6 +28,7 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.drawBehind +import androidx.compose.ui.draw.shadow import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.graphicsLayer @@ -1065,23 +1067,67 @@ private fun TelegramBiometricItem( Spacer(modifier = Modifier.width(20.dp)) - Text( - text = "Biometric Authentication", - fontSize = 16.sp, - color = textColor, - modifier = Modifier.weight(1f) + Column(modifier = Modifier.weight(1f)) { + Text( + text = "Biometric Authentication", + fontSize = 16.sp, + color = textColor + ) + + if (isEnabled) { + Text( + text = "Face ID / Touch ID", + fontSize = 13.sp, + color = textColor.copy(alpha = 0.5f), + modifier = Modifier.padding(top = 2.dp) + ) + } + } + + // iOS-style animated switch + val animatedThumbOffset by animateFloatAsState( + targetValue = if (isEnabled) 1f else 0f, + animationSpec = spring( + dampingRatio = Spring.DampingRatioMediumBouncy, + stiffness = Spring.StiffnessLow + ), + label = "switchThumb" ) - Switch( - checked = isEnabled, - onCheckedChange = { onToggle() }, - colors = SwitchDefaults.colors( - checkedThumbColor = Color.White, - checkedTrackColor = primaryBlue, - uncheckedThumbColor = Color.White, - uncheckedTrackColor = if (isDarkTheme) Color(0xFF3A3A3A) else Color(0xFFE0E0E0) - ) + val trackColor by animateColorAsState( + targetValue = if (isEnabled) primaryBlue else + if (isDarkTheme) Color(0xFF39393D) else Color(0xFFE9E9EA), + animationSpec = tween(300), + label = "trackColor" ) + + Box( + modifier = Modifier + .width(51.dp) + .height(31.dp) + .clip(RoundedCornerShape(15.5.dp)) + .background(trackColor) + .clickable( + interactionSource = remember { MutableInteractionSource() }, + indication = null, + onClick = { onToggle() } + ) + .padding(2.dp) + ) { + Box( + modifier = Modifier + .size(27.dp) + .align(Alignment.CenterStart) + .offset(x = (20.dp * animatedThumbOffset)) + .shadow( + elevation = if (isEnabled) 3.dp else 2.dp, + shape = CircleShape, + spotColor = Color.Black.copy(alpha = 0.15f) + ) + .clip(CircleShape) + .background(Color.White) + ) + } } }