Updated on 2026-08-14

This commit is contained in:
Tangem 2024-07-01 14:07:11 +03:00
parent f6d3003cb0
commit 2d8d9453bd
17 changed files with 763 additions and 55 deletions

View file

@ -58,7 +58,7 @@ internal fun ContentIcon(
}
@Composable
private fun CoinIcon(
fun CoinIcon(
url: String?,
@DrawableRes fallbackResId: Int,
alpha: Float,

View file

@ -4,14 +4,12 @@ import android.content.res.Configuration
import androidx.compose.animation.AnimatedContent
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.material.Icon
import androidx.compose.material.Text
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.onSizeChanged
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
@ -20,8 +18,8 @@ import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameter
import androidx.compose.ui.unit.Dp
import com.tangem.core.ui.R
import com.tangem.core.ui.components.RectangleShimmer
import com.tangem.core.ui.res.TangemThemePreview
import com.tangem.core.ui.res.TangemTheme
import com.tangem.core.ui.res.TangemThemePreview
import com.tangem.core.ui.utils.BigDecimalFormatter
/**
@ -116,7 +114,10 @@ private fun PriceBlock(state: MarketPriceBlockState, priceWidthDp: Dp) {
) {
Price(price = marketPriceBlockState.price, modifier = priceModifier)
PriceChangeInPercent(marketPriceBlockState.priceChangeConfig)
PriceChangeInPercent(
valueInPercent = marketPriceBlockState.priceChangeConfig.valueInPercent,
type = marketPriceBlockState.priceChangeConfig.type,
)
}
} else {
Price(price = BigDecimalFormatter.EMPTY_BALANCE_SIGN, modifier = priceModifier)
@ -136,47 +137,6 @@ private fun Price(price: String, modifier: Modifier = Modifier) {
)
}
@Composable
private fun PriceChangeInPercent(config: PriceChangeState.Content) {
AnimatedContent(
targetState = config.type,
contentAlignment = Alignment.CenterStart,
label = "Update price change",
) { type ->
Row(
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing2),
) {
Icon(
modifier = Modifier.size(TangemTheme.dimens.size8),
painter = painterResource(
id = when (type) {
PriceChangeType.UP -> R.drawable.ic_arrow_up_8
PriceChangeType.DOWN -> R.drawable.ic_arrow_down_8
PriceChangeType.NEUTRAL -> R.drawable.ic_elipse_8
},
),
tint = when (type) {
PriceChangeType.UP -> TangemTheme.colors.icon.accent
PriceChangeType.DOWN -> TangemTheme.colors.icon.warning
PriceChangeType.NEUTRAL -> TangemTheme.colors.icon.inactive
},
contentDescription = null,
)
Text(
text = config.valueInPercent,
color = when (type) {
PriceChangeType.UP -> TangemTheme.colors.text.accent
PriceChangeType.DOWN -> TangemTheme.colors.text.warning
PriceChangeType.NEUTRAL -> TangemTheme.colors.text.disabled
},
style = TangemTheme.typography.body2,
)
}
}
}
@Composable
private fun LoadingContent() {
Row(

View file

@ -0,0 +1,96 @@
package com.tangem.core.ui.components.marketprice
import android.content.res.Configuration
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import com.tangem.core.ui.R
import com.tangem.core.ui.res.TangemTheme
import com.tangem.core.ui.res.TangemThemePreview
@Composable
fun PriceChangeInPercent(
valueInPercent: String,
type: PriceChangeType,
modifier: Modifier = Modifier,
textStyle: TextStyle = TangemTheme.typography.body2,
) {
Row(
modifier = modifier,
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing2),
) {
Icon(
modifier = Modifier
.size(TangemTheme.dimens.size8)
.align(Alignment.CenterVertically),
imageVector = ImageVector.vectorResource(
id = when (type) {
PriceChangeType.UP -> R.drawable.ic_arrow_up_8
PriceChangeType.DOWN -> R.drawable.ic_arrow_down_8
PriceChangeType.NEUTRAL -> R.drawable.ic_elipse_8
},
),
tint = when (type) {
PriceChangeType.UP -> TangemTheme.colors.icon.accent
PriceChangeType.DOWN -> TangemTheme.colors.icon.warning
PriceChangeType.NEUTRAL -> TangemTheme.colors.icon.inactive
},
contentDescription = null,
)
Text(
text = valueInPercent,
color = when (type) {
PriceChangeType.UP -> TangemTheme.colors.text.accent
PriceChangeType.DOWN -> TangemTheme.colors.text.warning
PriceChangeType.NEUTRAL -> TangemTheme.colors.text.disabled
},
style = textStyle,
overflow = TextOverflow.Visible,
maxLines = 1,
)
}
}
//region Preview
@Preview
@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES)
@Composable
private fun Preview() {
TangemThemePreview {
Column {
PriceChangeInPercent(
valueInPercent = "52.00%",
type = PriceChangeType.NEUTRAL,
)
PriceChangeInPercent(
valueInPercent = "52.00%",
type = PriceChangeType.UP,
)
PriceChangeInPercent(
valueInPercent = "52.00%",
type = PriceChangeType.DOWN,
)
PriceChangeInPercent(
valueInPercent = "52.00%",
type = PriceChangeType.DOWN,
textStyle = TangemTheme.typography.caption2,
)
}
}
}
//endregion Preview

View file

@ -46,18 +46,18 @@ data class WindowSize(
fun heightAtMost(value: Dp): Boolean = this.height <= value
private fun getWidthWindowSizeType(windowDp: Dp): WindowSizeType = when {
windowDp < 300.dp -> WindowSizeType.ExtraSmall
windowDp < 380.dp -> WindowSizeType.Small
windowDp < 540.dp -> WindowSizeType.Normal
windowDp < 700.dp -> WindowSizeType.Large
windowDp <= 320.dp -> WindowSizeType.ExtraSmall
windowDp <= 360.dp -> WindowSizeType.Small
windowDp <= 540.dp -> WindowSizeType.Normal
windowDp <= 700.dp -> WindowSizeType.Large
else -> WindowSizeType.ExtraLarge
}
private fun getHeightWindowSizeType(heightDp: Dp): WindowSizeType = when {
heightDp < 480.dp -> WindowSizeType.ExtraSmall
heightDp < 640.dp -> WindowSizeType.Small
heightDp < 860.dp -> WindowSizeType.Normal
heightDp < 1100.dp -> WindowSizeType.Large
heightDp <= 480.dp -> WindowSizeType.ExtraSmall
heightDp <= 640.dp -> WindowSizeType.Small
heightDp <= 860.dp -> WindowSizeType.Normal
heightDp <= 1100.dp -> WindowSizeType.Large
else -> WindowSizeType.ExtraLarge
}
}

View file

@ -0,0 +1,10 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="28dp"
android:height="28dp"
android:viewportWidth="28"
android:viewportHeight="28">
<path
android:pathData="M15.05,6.65C15.05,6.07 14.58,5.6 14,5.6C13.42,5.6 12.95,6.07 12.95,6.65V12.95H6.65C6.07,12.95 5.6,13.42 5.6,14C5.6,14.58 6.07,15.05 6.65,15.05H12.95V21.35C12.95,21.93 13.42,22.4 14,22.4C14.58,22.4 15.05,21.93 15.05,21.35V15.05H21.35C21.93,15.05 22.4,14.58 22.4,14C22.4,13.42 21.93,12.95 21.35,12.95H15.05V6.65Z"
android:fillColor="#000000"
android:fillType="evenOdd"/>
</vector>