diff --git a/core/ui/src/main/res/drawable-hdpi/img_tangem_pay_visa.webp b/core/ui/src/main/res/drawable-hdpi/img_tangem_pay_visa.webp new file mode 100644 index 0000000000..37004a5f83 Binary files /dev/null and b/core/ui/src/main/res/drawable-hdpi/img_tangem_pay_visa.webp differ diff --git a/core/ui/src/main/res/drawable-xhdpi/img_tangem_pay_visa.webp b/core/ui/src/main/res/drawable-xhdpi/img_tangem_pay_visa.webp new file mode 100644 index 0000000000..3f017d7cb7 Binary files /dev/null and b/core/ui/src/main/res/drawable-xhdpi/img_tangem_pay_visa.webp differ diff --git a/core/ui/src/main/res/drawable-xxhdpi/img_tangem_pay_visa.webp b/core/ui/src/main/res/drawable-xxhdpi/img_tangem_pay_visa.webp new file mode 100644 index 0000000000..4f544ee02f Binary files /dev/null and b/core/ui/src/main/res/drawable-xxhdpi/img_tangem_pay_visa.webp differ diff --git a/core/ui/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa.webp b/core/ui/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa.webp new file mode 100644 index 0000000000..d6dbccc06f Binary files /dev/null and b/core/ui/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa.webp differ diff --git a/core/ui/src/main/res/drawable/img_tangem_pay_visa.webp b/core/ui/src/main/res/drawable/img_tangem_pay_visa.webp deleted file mode 100644 index 0622453761..0000000000 Binary files a/core/ui/src/main/res/drawable/img_tangem_pay_visa.webp and /dev/null differ diff --git a/core/ui/src/main/res/drawable/img_tangem_pay_visa_frozen.webp b/core/ui/src/main/res/drawable/img_tangem_pay_visa_frozen.webp deleted file mode 100644 index 1eb05e81c8..0000000000 Binary files a/core/ui/src/main/res/drawable/img_tangem_pay_visa_frozen.webp and /dev/null differ diff --git a/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/TangemPayCardDetailsBlock.kt b/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/TangemPayCardDetailsBlock.kt index 951778f3fb..1e21a98814 100644 --- a/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/TangemPayCardDetailsBlock.kt +++ b/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/TangemPayCardDetailsBlock.kt @@ -2,6 +2,7 @@ package com.tangem.features.tangempay.ui import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.core.EaseInOut +import androidx.compose.animation.core.FastOutSlowInEasing import androidx.compose.animation.core.animateFloatAsState import androidx.compose.animation.core.tween import androidx.compose.foundation.Image @@ -59,6 +60,7 @@ import com.tangem.features.tangempay.entity.TangemPayCardDetailsUM import com.tangem.features.tangempay.model.CardDataType private const val TEXT_WIDTH_PADDING = 2 +private const val FREEZE_ANIMATION_DURATION_MS = 600 private val CustomCardBlockColor = Color(0x1F828282) @Suppress("MagicNumber") @@ -122,15 +124,7 @@ internal fun TangemPayCard(state: TangemPayCardDetailsUM, modifier: Modifier = M @Composable private fun TangemPayCardDetailsHiddenBlock(state: TangemPayCardDetailsUM, modifier: Modifier = Modifier) { Box(modifier = modifier.fillMaxSize()) { - val imageResId = when (state.cardFrozenState) { - TangemPayCardFrozenState.Frozen -> R.drawable.img_tangem_pay_visa_frozen - else -> R.drawable.img_tangem_pay_visa - } - Image( - modifier = Modifier.fillMaxSize(), - painter = painterResource(id = imageResId), - contentDescription = null, - ) + TangemPayCardBackground(cardFrozenState = state.cardFrozenState) CardTopBlock() if (state.isActionsAvailable) { @@ -208,6 +202,37 @@ private fun TangemPayCardDetailsHiddenBlock(state: TangemPayCardDetailsUM, modif } } +@Composable +private fun TangemPayCardBackground(cardFrozenState: TangemPayCardFrozenState, modifier: Modifier = Modifier) { + val isFrozen = cardFrozenState == TangemPayCardFrozenState.Frozen + val freezeProgress by animateFloatAsState( + targetValue = if (isFrozen) 1f else 0f, + animationSpec = tween( + durationMillis = FREEZE_ANIMATION_DURATION_MS, + easing = FastOutSlowInEasing, + ), + label = "freezeProgress", + ) + + Box(modifier = modifier.fillMaxSize()) { + Image( + modifier = Modifier.fillMaxSize(), + painter = painterResource(R.drawable.img_tangem_pay_visa), + contentDescription = null, + ) + + if (isFrozen || freezeProgress > 0f) { + Image( + modifier = Modifier + .fillMaxSize() + .graphicsLayer { alpha = freezeProgress }, + painter = painterResource(R.drawable.img_tangem_pay_visa_frozen), + contentDescription = null, + ) + } + } +} + @Composable private fun CardTopBlock(modifier: Modifier = Modifier) { Row( diff --git a/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/components/TangemPayCardView.kt b/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/components/TangemPayCardView.kt index 0663d4bd6d..2736df1ef9 100644 --- a/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/components/TangemPayCardView.kt +++ b/features/tangempay/details/impl/src/main/kotlin/com/tangem/features/tangempay/ui/components/TangemPayCardView.kt @@ -139,7 +139,6 @@ private fun CardBackground( val w = size.width val h = size.height val radiusScaleRightCorner = h / 2f - val radiusScaleLeftCorner = h / 1.27f drawRect( brush = Brush.radialGradient( @@ -151,24 +150,11 @@ private fun CardBackground( ), Color.Transparent, ), - center = Offset(w - 20f, h * .05f), + center = Offset(w / 2, h * .05f), radius = radiusScaleRightCorner, tileMode = TileMode.Clamp, ), ) - - if (!isReissuing) { - drawRect( - brush = Brush.radialGradient( - colors = listOf( - Color(0xFF2881FF).copy(.25f), - Color.Transparent, - ), - center = Offset(0f, h + h * .1f), - radius = radiusScaleLeftCorner, - ), - ) - } } .border( width = 1.dp, diff --git a/features/tangempay/details/impl/src/main/res/drawable-hdpi/img_tangem_pay_visa_frozen.webp b/features/tangempay/details/impl/src/main/res/drawable-hdpi/img_tangem_pay_visa_frozen.webp new file mode 100644 index 0000000000..606b82e9cc Binary files /dev/null and b/features/tangempay/details/impl/src/main/res/drawable-hdpi/img_tangem_pay_visa_frozen.webp differ diff --git a/features/tangempay/details/impl/src/main/res/drawable-xhdpi/img_tangem_pay_visa_frozen.webp b/features/tangempay/details/impl/src/main/res/drawable-xhdpi/img_tangem_pay_visa_frozen.webp new file mode 100644 index 0000000000..59340a2343 Binary files /dev/null and b/features/tangempay/details/impl/src/main/res/drawable-xhdpi/img_tangem_pay_visa_frozen.webp differ diff --git a/features/tangempay/details/impl/src/main/res/drawable-xxhdpi/img_tangem_pay_visa_frozen.webp b/features/tangempay/details/impl/src/main/res/drawable-xxhdpi/img_tangem_pay_visa_frozen.webp new file mode 100644 index 0000000000..c5b089eeb2 Binary files /dev/null and b/features/tangempay/details/impl/src/main/res/drawable-xxhdpi/img_tangem_pay_visa_frozen.webp differ diff --git a/features/tangempay/details/impl/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa_frozen.webp b/features/tangempay/details/impl/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa_frozen.webp new file mode 100644 index 0000000000..5ce8fa0cc8 Binary files /dev/null and b/features/tangempay/details/impl/src/main/res/drawable-xxxhdpi/img_tangem_pay_visa_frozen.webp differ