Updated on 2026-08-14

This commit is contained in:
Tangem 2022-12-12 11:25:00 +03:00
commit 351671604a
7 changed files with 190 additions and 57 deletions

View file

@ -30,7 +30,7 @@ enum class SettingsElement(
LinkMoreCards(R.drawable.ic_more_cards, R.string.details_row_title_create_backup),
TermsOfService(R.drawable.ic_text, R.string.disclaimer_title), // General Terms of Service of the App
TermsOfUse(R.drawable.ic_text, R.string.details_row_title_card_tou), // Terms of Use for S2C cards only
PrivacyPolicy(R.drawable.ic_lock, R.string.details_row_privacy_policy);
PrivacyPolicy(R.drawable.ic_lock_24, R.string.details_row_privacy_policy);
}
@Immutable

View file

@ -6,7 +6,13 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.SnackbarHost
import androidx.compose.material.SnackbarHostState
import androidx.compose.runtime.*
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.State
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberUpdatedState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.fragment.app.viewModels
@ -18,7 +24,7 @@ import com.tangem.tap.features.details.ui.cardsettings.resolveReference
import com.tangem.tap.features.saveWallet.ui.components.SaveWalletScreenContent
internal class SaveWalletBottomSheetFragment : ComposeBottomSheetFragment<SaveWalletScreenState>() {
override val expandedHeightFraction: Float = .95f
override val expandedHeightFraction: Float = .98f
private val viewModel by viewModels<SaveWalletViewModel>()

View file

@ -1,27 +1,34 @@
package com.tangem.tap.features.saveWallet.ui.components
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.widthIn
import androidx.compose.material.Icon
import androidx.compose.material.IconButton
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.capitalize
import androidx.compose.ui.text.intl.Locale
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import com.tangem.core.ui.components.PrimaryButton
import com.tangem.core.ui.components.SpacerH12
import com.tangem.core.ui.components.SpacerH16
import com.tangem.core.ui.components.SpacerH24
import com.tangem.core.ui.components.SpacerH32
import com.tangem.core.ui.components.SpacerH4
import com.tangem.core.ui.components.SpacerHHalf
import com.tangem.core.ui.components.SpacerW24
import com.tangem.core.ui.components.SpacerW8
import com.tangem.core.ui.components.atoms.Hand
import com.tangem.core.ui.res.TangemTheme
import com.tangem.wallet.R
@ -34,79 +41,141 @@ internal fun SaveWalletScreenContent(
onCloseClick: () -> Unit,
) {
Column(
modifier = modifier
.padding(horizontal = TangemTheme.dimens.spacing16),
modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally,
) {
Hand()
IconButton(
Header(
modifier = Modifier.fillMaxWidth(),
onCloseClick = onCloseClick,
)
SpacerHHalf()
Title(
modifier = Modifier
.align(Alignment.End)
.padding(all = TangemTheme.dimens.spacing8)
.size(TangemTheme.dimens.size32),
onClick = onCloseClick,
.widthIn(max = TangemTheme.dimens.size200),
)
SpacerH32()
Description(
modifier = Modifier
.padding(
start = TangemTheme.dimens.spacing34,
end = TangemTheme.dimens.spacing56,
)
.fillMaxWidth(),
)
SpacerHHalf()
Footer(
modifier = Modifier
.padding(horizontal = TangemTheme.dimens.spacing16)
.fillMaxWidth(),
showProgress = showProgress,
onSaveWalletClick = onSaveWalletClick,
)
SpacerH16()
}
}
@Composable
private fun Header(
modifier: Modifier = Modifier,
onCloseClick: () -> Unit,
) {
Column(
modifier = modifier,
verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing8),
) {
Hand()
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.End,
) {
Icon(
modifier = Modifier.size(TangemTheme.dimens.size24),
painter = painterResource(id = R.drawable.ic_close),
tint = TangemTheme.colors.icon.secondary,
contentDescription = stringResource(id = R.string.common_cancel),
)
IconButton(
modifier = Modifier.size(TangemTheme.dimens.size32),
onClick = onCloseClick,
) {
Icon(
modifier = Modifier.size(TangemTheme.dimens.size24),
painter = painterResource(id = R.drawable.ic_close),
tint = TangemTheme.colors.icon.secondary,
contentDescription = stringResource(id = R.string.common_cancel),
)
}
SpacerW8()
}
Spacer(modifier = Modifier.weight(.7f))
}
}
@Composable
private fun Title(
modifier: Modifier = Modifier,
) {
Column(
modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing32),
) {
Icon(
modifier = Modifier.size(TangemTheme.dimens.size56),
painter = painterResource(id = R.drawable.ic_fingerprint_24),
tint = TangemTheme.colors.icon.informative,
tint = TangemTheme.colors.icon.primary1,
contentDescription = null,
)
SpacerH24()
Box(
modifier = Modifier
.background(
color = TangemTheme.colors.text.accent.copy(alpha = .12f),
shape = TangemTheme.shapes.roundedCornersMedium,
),
) {
Text(
modifier = Modifier
.padding(
vertical = TangemTheme.dimens.spacing4,
horizontal = TangemTheme.dimens.spacing12,
),
text = stringResource(R.string.save_user_wallet_agreement_new_feature),
style = TangemTheme.typography.subtitle2,
color = TangemTheme.colors.text.accent,
textAlign = TextAlign.Center,
)
}
SpacerH24()
Text(
modifier = Modifier.fillMaxWidth(),
text = stringResource(R.string.onboarding_navbar_save_wallet),
text = stringResource(
id = R.string.save_user_wallet_agreement_header,
stringResource(id = R.string.common_biometrics).capitalize(Locale.current),
),
style = TangemTheme.typography.h2,
color = TangemTheme.colors.text.primary1,
textAlign = TextAlign.Center,
)
SpacerH12()
Text(
modifier = Modifier.fillMaxWidth(fraction = .87f),
text = stringResource(R.string.save_user_wallet_agreement_description),
style = TangemTheme.typography.body1,
color = TangemTheme.colors.text.secondary,
textAlign = TextAlign.Center,
}
}
@Composable
private fun Description(
modifier: Modifier = Modifier,
) {
Column(
modifier = modifier,
verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing24),
horizontalAlignment = Alignment.Start,
) {
DescriptionItem(
iconPainter = painterResource(id = R.drawable.ic_face_recognition_24),
title = stringResource(id = R.string.save_user_wallet_agreement_access_title),
description = stringResource(id = R.string.save_user_wallet_agreement_access_description),
)
Spacer(modifier = Modifier.weight(1f))
DescriptionItem(
iconPainter = painterResource(id = R.drawable.ic_lock_24),
title = stringResource(id = R.string.save_user_wallet_agreement_code_title),
description = stringResource(
id = R.string.save_user_wallet_agreement_code_description,
stringResource(id = R.string.common_biometrics).capitalize(Locale.current),
),
)
}
}
@Composable
private fun Footer(
modifier: Modifier = Modifier,
showProgress: Boolean,
onSaveWalletClick: () -> Unit,
) {
Column(
modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing16),
) {
PrimaryButton(
modifier = Modifier.fillMaxWidth(),
showProgress = showProgress,
text = stringResource(
id = R.string.save_user_wallet_agreement_allow,
stringResource(id = R.string.common_biometric_authentication),
stringResource(id = R.string.common_biometrics).capitalize(Locale.current),
),
onClick = onSaveWalletClick,
)
SpacerH16()
Text(
modifier = Modifier.fillMaxWidth(fraction = .7f),
text = stringResource(R.string.save_user_wallet_agreement_notice),
@ -114,7 +183,41 @@ internal fun SaveWalletScreenContent(
color = TangemTheme.colors.text.tertiary,
textAlign = TextAlign.Center,
)
SpacerH16()
}
}
@Composable
private fun DescriptionItem(
modifier: Modifier = Modifier,
iconPainter: Painter,
title: String,
description: String,
) {
Row(
modifier = modifier,
verticalAlignment = Alignment.Top,
horizontalArrangement = Arrangement.SpaceEvenly,
) {
Icon(
modifier = Modifier.size(TangemTheme.dimens.size24),
painter = iconPainter,
tint = TangemTheme.colors.icon.primary1,
contentDescription = null,
)
SpacerW24()
Column {
Text(
text = title,
style = TangemTheme.typography.subtitle1,
color = TangemTheme.colors.text.primary1,
)
SpacerH4()
Text(
text = description,
style = TangemTheme.typography.body2,
color = TangemTheme.colors.text.secondary,
)
}
}
}

View file

@ -61,6 +61,11 @@ fun SpacerH24(modifier: Modifier = Modifier) {
SpacerH(24.dp, modifier)
}
@Composable
fun SpacerH28(modifier: Modifier = Modifier) {
SpacerH(28.dp, modifier)
}
@Composable
fun SpacerH32(modifier: Modifier = Modifier) {
SpacerH(32.dp, modifier)
@ -71,6 +76,12 @@ fun SpacerH32(modifier: Modifier = Modifier) {
fun ColumnScope.SpacerHMax(modifier: Modifier = Modifier) {
Spacer(modifier = modifier.weight(1f))
}
// TODO: Refactor with context receivers
@Composable
fun ColumnScope.SpacerHHalf(modifier: Modifier = Modifier) {
Spacer(modifier = modifier.weight(.5f))
}
// endregion Horizontal
// region Vertical

View file

@ -61,6 +61,7 @@ data class TangemDimens internal constructor(
val spacing16: Dp = 16.dp,
val spacing24: Dp = 24.dp,
val spacing32: Dp = 32.dp,
val spacing34: Dp = 34.dp,
val spacing44: Dp = 44.dp,
val spacing50: Dp = 50.dp,
val spacing54: Dp = 54.dp,

View file

@ -0,0 +1,12 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group>
<clip-path android:pathData="M0,0h24v24h-24z" />
<path
android:fillColor="#000000"
android:pathData="M9,11.75C8.668,11.75 8.351,11.882 8.116,12.116C7.882,12.351 7.75,12.668 7.75,13C7.75,13.332 7.882,13.649 8.116,13.884C8.351,14.118 8.668,14.25 9,14.25C9.164,14.25 9.327,14.218 9.478,14.155C9.63,14.092 9.768,14 9.884,13.884C10,13.768 10.092,13.63 10.155,13.478C10.218,13.327 10.25,13.164 10.25,13C10.25,12.836 10.218,12.673 10.155,12.522C10.092,12.37 10,12.232 9.884,12.116C9.768,12 9.63,11.908 9.478,11.845C9.327,11.782 9.164,11.75 9,11.75ZM15,11.75C14.668,11.75 14.351,11.882 14.116,12.116C13.882,12.351 13.75,12.668 13.75,13C13.75,13.332 13.882,13.649 14.116,13.884C14.351,14.118 14.668,14.25 15,14.25C15.332,14.25 15.649,14.118 15.884,13.884C16.118,13.649 16.25,13.332 16.25,13C16.25,12.668 16.118,12.351 15.884,12.116C15.649,11.882 15.332,11.75 15,11.75ZM12,2C10.687,2 9.386,2.259 8.173,2.761C6.96,3.264 5.858,4 4.929,4.929C3.054,6.804 2,9.348 2,12C2,14.652 3.054,17.196 4.929,19.071C5.858,20 6.96,20.736 8.173,21.239C9.386,21.741 10.687,22 12,22C14.652,22 17.196,20.946 19.071,19.071C20.946,17.196 22,14.652 22,12C22,10.687 21.741,9.386 21.239,8.173C20.736,6.96 20,5.858 19.071,4.929C18.142,4 17.04,3.264 15.827,2.761C14.614,2.259 13.313,2 12,2ZM12,20C9.878,20 7.843,19.157 6.343,17.657C4.843,16.157 4,14.122 4,12C3.97,11.71 3.97,11.43 4,11.14C6.38,10.1 8.27,8.17 9.26,5.77C11.13,8.42 14.17,10 17.42,10C18.18,10 18.93,9.91 19.67,9.74C20.92,14 18.5,18.43 14.26,19.67C13.5,19.89 12.76,20 12,20ZM0,2C0,1.47 0.211,0.961 0.586,0.586C0.961,0.211 1.47,0 2,0L6,0V2H2V6H0V2ZM24,22C24,22.53 23.789,23.039 23.414,23.414C23.039,23.789 22.53,24 22,24H18V22H22V18H24V22ZM2,24C1.47,24 0.961,23.789 0.586,23.414C0.211,23.039 0,22.53 0,22V18H2V22H6V24H2ZM22,0C22.53,0 23.039,0.211 23.414,0.586C23.789,0.961 24,1.47 24,2V6H22V2H18V0H22Z" />
</group>
</vector>