From 53e29be3c29dc833f99d7d0b75cdd899f1f90d1b Mon Sep 17 00:00:00 2001 From: Tangem Date: Mon, 10 Feb 2025 11:01:12 +0500 Subject: [PATCH] Updated on 2026-08-14 --- .../buttons/HorizontalActionChips.kt | 32 ++++++++++++------- .../buttons/actions/ActionButtonConfig.kt | 3 ++ .../ui/components/buttons/actions/Actions.kt | 28 ++++++++++++++++ .../ui/components/TokenDetailsBalanceBlock.kt | 1 + 4 files changed, 52 insertions(+), 12 deletions(-) diff --git a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/HorizontalActionChips.kt b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/HorizontalActionChips.kt index 715a630ed3..c7f0ba8246 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/HorizontalActionChips.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/HorizontalActionChips.kt @@ -4,20 +4,23 @@ import android.content.res.Configuration import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyRow import androidx.compose.foundation.lazy.items import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider +import androidx.compose.ui.unit.dp import com.tangem.core.ui.R import com.tangem.core.ui.components.buttons.actions.ActionButton import com.tangem.core.ui.components.buttons.actions.ActionButtonConfig import com.tangem.core.ui.extensions.TextReference -import com.tangem.core.ui.res.TangemThemePreview import com.tangem.core.ui.res.TangemTheme +import com.tangem.core.ui.res.TangemThemePreview import kotlinx.collections.immutable.ImmutableList import kotlinx.collections.immutable.persistentListOf @@ -25,6 +28,7 @@ import kotlinx.collections.immutable.persistentListOf fun HorizontalActionChips( buttons: ImmutableList, modifier: Modifier = Modifier, + containerColor: Color = TangemTheme.colors.background.secondary, contentPadding: PaddingValues = PaddingValues(TangemTheme.dimens.spacing0), ) { LazyRow( @@ -36,7 +40,7 @@ fun HorizontalActionChips( // do not use key cause when change items order, list is scrolled items( items = buttons, - itemContent = { ActionButton(config = it) }, + itemContent = { ActionButton(config = it, containerColor = containerColor) }, ) } } @@ -46,22 +50,31 @@ fun HorizontalActionChips( @Preview(widthDp = 360, uiMode = Configuration.UI_MODE_NIGHT_YES) @Composable private fun Preview_HorizontalActionChips( - @PreviewParameter(ActionButtonConfigProvider::class) buttons: HorizontalActionChips, + @PreviewParameter(ActionButtonConfigProvider::class) buttons: HorizontalActionChipsData, ) { TangemThemePreview { - HorizontalActionChips(buttons = buttons.buttons) + HorizontalActionChips( + buttons = buttons.buttons, + modifier = Modifier.padding(4.dp), + ) } } -private class ActionButtonConfigProvider : CollectionPreviewParameterProvider( +private class ActionButtonConfigProvider : CollectionPreviewParameterProvider( collection = listOf( - HorizontalActionChips( + HorizontalActionChipsData( buttons = persistentListOf( ActionButtonConfig( text = TextReference.Str(value = "Buy"), iconResId = R.drawable.ic_plus_24, onClick = {}, ), + ActionButtonConfig( + text = TextReference.Str(value = "Exchange"), + iconResId = R.drawable.ic_exchange_vertical_24, + onClick = {}, + showBadge = true, + ), ActionButtonConfig( text = TextReference.Str(value = "Send"), iconResId = R.drawable.ic_arrow_up_24, @@ -72,17 +85,12 @@ private class ActionButtonConfigProvider : CollectionPreviewParameterProvider, ) // endregion Preview \ No newline at end of file diff --git a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/ActionButtonConfig.kt b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/ActionButtonConfig.kt index d315a2a715..290b811544 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/ActionButtonConfig.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/ActionButtonConfig.kt @@ -13,6 +13,8 @@ import com.tangem.core.ui.extensions.TextReference * @property enabled enabled * @property dimContent determines whether the button content will be dimmed. This property will be ignored if [enabled] * is `false`. + * @property isInProgress indicates progress state of button + * @property showBadge display dot in upper right corner * [REDACTED_AUTHOR] */ @@ -24,4 +26,5 @@ data class ActionButtonConfig( val enabled: Boolean = true, val dimContent: Boolean = false, val isInProgress: Boolean = false, + val showBadge: Boolean = false, ) \ No newline at end of file diff --git a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/Actions.kt b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/Actions.kt index d5d30f90ca..63807a2a7d 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/Actions.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/components/buttons/actions/Actions.kt @@ -17,7 +17,10 @@ import androidx.compose.runtime.getValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.draw.drawWithContent +import androidx.compose.ui.geometry.Offset import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.drawscope.DrawScope import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.style.TextOverflow @@ -29,6 +32,7 @@ import androidx.compose.ui.unit.dp import com.tangem.core.ui.R import com.tangem.core.ui.extensions.TextReference import com.tangem.core.ui.extensions.resolveReference +import com.tangem.core.ui.res.TangemColorPalette import com.tangem.core.ui.res.TangemTheme import com.tangem.core.ui.res.TangemThemePreview @@ -81,6 +85,7 @@ fun ActionButton( config: ActionButtonConfig, modifier: Modifier = Modifier, color: Color = TangemTheme.colors.button.secondary, + containerColor: Color = TangemTheme.colors.background.secondary, ) { ActionBaseButton( config = config, @@ -97,6 +102,7 @@ fun ActionButton( }, modifier = modifier, color = color, + containerColor = containerColor, ) } @@ -108,6 +114,7 @@ fun ActionBaseButton( content: @Composable (modifier: Modifier) -> Unit, modifier: Modifier = Modifier, color: Color = TangemTheme.colors.button.secondary, + containerColor: Color = TangemTheme.colors.background.secondary, ) { val context = LocalContext.current val backgroundColor by animateColorAsState( @@ -119,6 +126,12 @@ fun ActionBaseButton( modifier = modifier .heightIn(min = 36.dp) .widthIn(min = 100.dp) + .drawWithContent { + drawContent() + if (config.showBadge) { + drawBadge(containerColor = containerColor) + } + } .clip(shape) .combinedClickable( enabled = config.enabled, @@ -212,6 +225,20 @@ fun getTextColor(config: ActionButtonConfig): Color { } } +private fun DrawScope.drawBadge(containerColor: Color) { + val width = size.width + drawCircle( + color = containerColor, + center = Offset(x = width - 2.dp.toPx(), y = 2.dp.toPx()), + radius = 5.dp.toPx(), + ) + drawCircle( + color = TangemColorPalette.Azure, + center = Offset(x = width - 2.dp.toPx(), y = 2.dp.toPx()), + radius = 3.dp.toPx(), + ) +} + @Preview(group = "RoundedActionButton", showBackground = true) @Preview(group = "RoundedActionButton", showBackground = true, uiMode = Configuration.UI_MODE_NIGHT_YES) @Composable @@ -237,6 +264,7 @@ private class ActionStateProvider : CollectionPreviewParameterProvider