From 3fbddfa8c7f3fa365a41cfbec5ec72aecd6f176f Mon Sep 17 00:00:00 2001 From: Tangem Date: Tue, 12 Sep 2023 13:42:57 +0300 Subject: [PATCH] Updated on 2026-08-14 --- .../core/ui/extensions/CryptoCurrency.kt | 7 ++++-- .../component/token/icon/ContentIcon.kt | 24 +++++++++++++++---- .../common/component/token/icon/IconBadge.kt | 8 ++++++- .../common/component/token/icon/TokenIcon.kt | 17 ++++++++----- .../CryptoCurrencyToIconStateConverter.kt | 7 +++--- 5 files changed, 47 insertions(+), 16 deletions(-) diff --git a/core/ui/src/main/java/com/tangem/core/ui/extensions/CryptoCurrency.kt b/core/ui/src/main/java/com/tangem/core/ui/extensions/CryptoCurrency.kt index 752b3cc492..c30323a1b2 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/extensions/CryptoCurrency.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/extensions/CryptoCurrency.kt @@ -26,8 +26,11 @@ val CryptoCurrency.networkIconResId: Int * @param fallbackColor The color to use as a fallback. * @return The extracted background color or the fallback color if extraction fails or if it is a test network token. */ -fun CryptoCurrency.Token.tryGetBackgroundForTokenIcon(fallbackColor: Color = TangemColorPalette.Black): Color { - if (network.isTestnet) return fallbackColor +fun CryptoCurrency.Token.tryGetBackgroundForTokenIcon( + isGrayscale: Boolean, + fallbackColor: Color = TangemColorPalette.Black, +): Color { + if (isGrayscale) return TangemColorPalette.Dark2 return try { val colorHex = "#" + contractAddress.substring(range = COLOR_HEX_START_INDEX..COLOR_HEX_END_INDEX) diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/ContentIcon.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/ContentIcon.kt index c51cb1e957..49e3b3f183 100644 --- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/ContentIcon.kt +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/ContentIcon.kt @@ -19,23 +19,31 @@ import com.tangem.feature.wallet.impl.R import com.tangem.feature.wallet.presentation.common.state.TokenItemState @Composable -internal fun ContentIcon(icon: TokenItemState.IconState, colorFilter: ColorFilter?, modifier: Modifier = Modifier) { +internal fun ContentIcon( + icon: TokenItemState.IconState, + alpha: Float, + colorFilter: ColorFilter?, + modifier: Modifier = Modifier, +) { when (icon) { is TokenItemState.IconState.CoinIcon -> CoinIcon( modifier = modifier, url = icon.url, fallbackResId = icon.fallbackResId, + alpha = alpha, colorFilter = colorFilter, ) is TokenItemState.IconState.TokenIcon -> TokenIcon( modifier = modifier, url = icon.url, + alpha = alpha, colorFilter = colorFilter, errorIcon = { CustomTokenIcon( modifier = modifier, tint = icon.fallbackTint, background = icon.fallbackBackground, + alpha = alpha, ) }, ) @@ -43,6 +51,7 @@ internal fun ContentIcon(icon: TokenItemState.IconState, colorFilter: ColorFilte modifier = modifier, tint = icon.tint, background = icon.background, + alpha = alpha, ) } } @@ -51,6 +60,7 @@ internal fun ContentIcon(icon: TokenItemState.IconState, colorFilter: ColorFilte private fun CoinIcon( url: String?, @DrawableRes fallbackResId: Int, + alpha: Float, colorFilter: ColorFilter?, modifier: Modifier = Modifier, ) { @@ -62,10 +72,12 @@ private fun CoinIcon( errorIcon = { Image( painter = painterResource(id = fallbackResId), + alpha = alpha, colorFilter = colorFilter, contentDescription = null, ) }, + alpha = alpha, colorFilter = colorFilter, ) } @@ -73,6 +85,7 @@ private fun CoinIcon( @Composable private fun TokenIcon( url: String?, + alpha: Float, colorFilter: ColorFilter?, errorIcon: @Composable () -> Unit, modifier: Modifier = Modifier, @@ -84,17 +97,18 @@ private fun TokenIcon( modifier = modifier, iconData = url, errorIcon = errorIcon, + alpha = alpha, colorFilter = colorFilter, ) } } @Composable -private fun CustomTokenIcon(tint: Color, background: Color, modifier: Modifier = Modifier) { +private fun CustomTokenIcon(tint: Color, background: Color, alpha: Float, modifier: Modifier = Modifier) { Box( modifier = modifier .background( - color = background, + color = background.copy(alpha = alpha), shape = CircleShape, ), contentAlignment = Alignment.Center, @@ -102,7 +116,7 @@ private fun CustomTokenIcon(tint: Color, background: Color, modifier: Modifier = Icon( modifier = Modifier.matchParentSize(), painter = painterResource(id = R.drawable.ic_custom_token_44), - tint = tint, + tint = tint.copy(alpha = alpha), contentDescription = null, ) } @@ -111,6 +125,7 @@ private fun CustomTokenIcon(tint: Color, background: Color, modifier: Modifier = @Composable private inline fun DefaultCurrencyIcon( iconData: Any, + alpha: Float, colorFilter: ColorFilter?, crossinline errorIcon: @Composable () -> Unit, modifier: Modifier = Modifier, @@ -123,6 +138,7 @@ private inline fun DefaultCurrencyIcon( .build(), loading = { LoadingIcon() }, error = { errorIcon() }, + alpha = alpha, colorFilter = colorFilter, contentDescription = null, ) diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/IconBadge.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/IconBadge.kt index 8bc2dbb218..6fd0339923 100644 --- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/IconBadge.kt +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/IconBadge.kt @@ -14,7 +14,12 @@ import androidx.compose.ui.res.painterResource import com.tangem.core.ui.res.TangemTheme @Composable -internal fun NetworkBadge(@DrawableRes iconResId: Int, colorFilter: ColorFilter?, modifier: Modifier = Modifier) { +internal fun NetworkBadge( + @DrawableRes iconResId: Int, + alpha: Float, + colorFilter: ColorFilter?, + modifier: Modifier = Modifier, +) { Box( modifier = modifier .size(TangemTheme.dimens.size18) @@ -29,6 +34,7 @@ internal fun NetworkBadge(@DrawableRes iconResId: Int, colorFilter: ColorFilter? .matchParentSize(), painter = painterResource(id = iconResId), colorFilter = colorFilter, + alpha = alpha, contentDescription = null, ) } diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/TokenIcon.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/TokenIcon.kt index 39b31782a3..be02ad2229 100644 --- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/TokenIcon.kt +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/token/icon/TokenIcon.kt @@ -17,6 +17,8 @@ import com.tangem.core.ui.res.TangemTheme import com.tangem.feature.wallet.presentation.common.state.TokenItemState private const val GRAY_SCALE_SATURATION = 0f +private const val GRAY_SCALE_ALPHA = 0.4f +private const val NORMAL_ALPHA = 1f @Composable internal fun TokenIcon(state: TokenItemState, modifier: Modifier = Modifier) { @@ -58,19 +60,18 @@ private fun LockedIcon(modifier: Modifier = Modifier) { @Composable private fun BoxScope.ContentIconContainer(icon: TokenItemState.IconState, modifier: Modifier = Modifier) { val networkBadgeOffset = TangemTheme.dimens.spacing4 - val colorFilter = remember(icon.isGrayscale) { + val (alpha, colorFilter) = remember(icon.isGrayscale) { if (icon.isGrayscale) { - ColorFilter.colorMatrix( - colorMatrix = ColorMatrix().apply { setToSaturation(GRAY_SCALE_SATURATION) }, - ) + GRAY_SCALE_ALPHA to GrayscaleColorFilter } else { - null + NORMAL_ALPHA to null } } ContentIcon( modifier = modifier, icon = icon, + alpha = alpha, colorFilter = colorFilter, ) @@ -80,6 +81,7 @@ private fun BoxScope.ContentIconContainer(icon: TokenItemState.IconState, modifi .offset(x = networkBadgeOffset, y = -networkBadgeOffset) .align(Alignment.TopEnd), iconResId = requireNotNull(icon.networkBadgeIconResId), + alpha = alpha, colorFilter = colorFilter, ) } @@ -92,4 +94,7 @@ private fun BoxScope.ContentIconContainer(icon: TokenItemState.IconState, modifi @Composable private inline fun BaseContainer(modifier: Modifier = Modifier, content: @Composable BoxScope.() -> Unit) { Box(modifier = modifier.size(size = TangemTheme.dimens.size40), content = content) -} \ No newline at end of file +} + +private val GrayscaleColorFilter: ColorFilter + get() = ColorFilter.colorMatrix(ColorMatrix().apply { setToSaturation(GRAY_SCALE_SATURATION) }) \ No newline at end of file diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/utils/CryptoCurrencyToIconStateConverter.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/utils/CryptoCurrencyToIconStateConverter.kt index 7f8c497f18..8c07d881af 100644 --- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/utils/CryptoCurrencyToIconStateConverter.kt +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/utils/CryptoCurrencyToIconStateConverter.kt @@ -30,7 +30,8 @@ internal class CryptoCurrencyToIconStateConverter : Converter