From f0c641aa169c49f81ae6e6417f1fda4c4b720c0a Mon Sep 17 00:00:00 2001 From: Rafael Date: Tue, 26 Nov 2024 15:36:28 +0600 Subject: [PATCH] Add premium banner to MainSettings --- .../settings/main/MainSettingsScreen.kt | 33 ++- .../modules/settings/main/PremiumBanner.kt | 242 ++++++++++++++++++ .../main/res/drawable/premium_banner_star.xml | 217 ++++++++++++++++ app/src/main/res/values/strings.xml | 6 + 4 files changed, 486 insertions(+), 12 deletions(-) create mode 100644 app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/PremiumBanner.kt create mode 100644 app/src/main/res/drawable/premium_banner_star.xml diff --git a/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/MainSettingsScreen.kt b/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/MainSettingsScreen.kt index ba5f3efc2c..e234c23cfa 100644 --- a/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/MainSettingsScreen.kt +++ b/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/MainSettingsScreen.kt @@ -2,6 +2,7 @@ package io.horizontalsystems.bankwallet.modules.settings.main import android.content.Context import android.content.Intent +import android.widget.Toast import androidx.annotation.DrawableRes import androidx.annotation.StringRes import androidx.compose.foundation.Image @@ -89,18 +90,9 @@ private fun SettingSections( val uiState = viewModel.uiState val context = LocalContext.current - CellUniversalLawrenceSection( - listOf { - HsSettingCell( - R.string.Settings_Donate, - R.drawable.ic_heart_filled_24, - ComposeAppTheme.colors.jacob, - onClick = { - navController.slideFromRight(R.id.donateTokenSelectFragment) - - stat(page = StatPage.Settings, event = StatEvent.Open(StatPage.Donate)) - } - ) + PremiumBanner( + onClick = { + Toast.makeText(context, "Hello world", Toast.LENGTH_SHORT).show() } ) @@ -360,6 +352,23 @@ private fun SettingSections( VSpacer(32.dp) + CellUniversalLawrenceSection( + listOf { + HsSettingCell( + R.string.Settings_Donate, + R.drawable.ic_heart_filled_24, + ComposeAppTheme.colors.jacob, + onClick = { + navController.slideFromRight(R.id.donateTokenSelectFragment) + + stat(page = StatPage.Settings, event = StatEvent.Open(StatPage.Donate)) + } + ) + } + ) + + VSpacer(32.dp) + CellUniversalLawrenceSection( listOf({ HsSettingCell( diff --git a/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/PremiumBanner.kt b/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/PremiumBanner.kt new file mode 100644 index 0000000000..fd48b1c8bf --- /dev/null +++ b/app/src/main/java/io/horizontalsystems/bankwallet/modules/settings/main/PremiumBanner.kt @@ -0,0 +1,242 @@ +package io.horizontalsystems.bankwallet.modules.settings.main + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxHeight +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableFloatStateOf +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.alpha +import androidx.compose.ui.draw.clip +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.AnnotatedString +import androidx.compose.ui.text.SpanStyle +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.buildAnnotatedString +import androidx.compose.ui.text.withStyle +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import io.horizontalsystems.bankwallet.R +import io.horizontalsystems.bankwallet.ui.compose.ComposeAppTheme +import io.horizontalsystems.bankwallet.ui.compose.components.VSpacer +import io.horizontalsystems.bankwallet.ui.compose.components.headline1_leah + + +@Composable +fun PremiumBanner(onClick: () -> Unit) { + val bodyText = highlightText( + text = stringResource(R.string.SettingsBanner_PremiumBannerDescription), + highlightPart = stringResource(R.string.SettingsBanner_PremiumBannerHighlightedWord), + color = ComposeAppTheme.colors.jacob + ) + + val radialGradient = Brush.linearGradient( + colors = listOf( + Color(0xCCEDD716), + Color(0x4DFF9B26), + Color(0x000F1014), + Color(0x000F1014), + ), + start = Offset(0f, Float.POSITIVE_INFINITY), + end = Offset(Float.POSITIVE_INFINITY, 0f) + ) + + val topRightRadialGradient = Brush.linearGradient( + colors = listOf( + Color(0x66003C74), + Color(0x000F1014), + ), + start = Offset(Float.POSITIVE_INFINITY, 0f), + end = Offset( 0f, Float.POSITIVE_INFINITY) + ) + + val greenGradient = Brush.verticalGradient( + colors = listOf( + Color(0xFF1FF994), + Color(0xFF05C46B), + ), + ) + + Box( + modifier = Modifier + .fillMaxWidth() + .fillMaxHeight() + .padding(horizontal = 16.dp) + .clip(RoundedCornerShape(16.dp)) + .background(Color(0xFF0F1014)) + .height(IntrinsicSize.Max) + .clickable(onClick = onClick) + ) { + Row( + modifier = Modifier + .fillMaxSize() + ) { + Box( + modifier = Modifier + .weight(3f) + .fillMaxHeight() + ) + Box( + modifier = Modifier + .weight(5f) + .fillMaxHeight() + .background(topRightRadialGradient) + ) + } + Row( + modifier = Modifier + .fillMaxSize() + ) { + Box( + modifier = Modifier + .weight(3f) + .fillMaxHeight() + .background(radialGradient) + ) + Box( + modifier = Modifier + .weight(1f) + .fillMaxHeight() + ) + } + Row( + modifier = Modifier.fillMaxWidth(), + horizontalArrangement = Arrangement.SpaceBetween, + verticalAlignment = Alignment.CenterVertically + ) { + Column( + modifier = Modifier + .weight(1f) + .padding(vertical = 16.dp) + .padding(start = 16.dp) + .padding(end = 8.dp) + ) { + headline1_leah(stringResource(R.string.SettingsBanner_GetPremium)) + + VSpacer(12.dp) + + AutoSizedText(bodyText) + + VSpacer(12.dp) + + Text( + text = stringResource(R.string.SettingsBanner_FreeFor7Days), + style = TextStyle(greenGradient), + fontSize = 14.sp + ) + } + + Image( + painter = painterResource(R.drawable.premium_banner_star), + modifier = Modifier + .padding(end = 16.dp) + .size(118.dp), + contentDescription = null + ) + + } + } +} + +@Composable +private fun AutoSizedText( + bodyText: AnnotatedString, + maxLines: Int = 2, + initialFontSize: Float = 20f, + minFontSize: Float = 8f, + modifier: Modifier = Modifier +) { + var fontSize by remember { mutableFloatStateOf(initialFontSize) } + var isTextReady by remember { mutableStateOf(false) } + + Box(modifier = modifier) { + + Text( + text = bodyText, + modifier = Modifier + .alpha(0f) + .fillMaxWidth(), + fontSize = fontSize.sp, + maxLines = maxLines, + onTextLayout = { textLayoutResult -> + if (textLayoutResult.didOverflowHeight || textLayoutResult.didOverflowWidth) { + if (fontSize > minFontSize) { + fontSize -= 1f + } else { + isTextReady = true + } + } else { + isTextReady = true + } + } + ) + + // Visible TextField only when size is ready + if (isTextReady) { + Text( + text = bodyText, + modifier = Modifier.fillMaxWidth(), + fontSize = fontSize.sp, + maxLines = maxLines, + color = Color.White, + ) + } + } +} + +@Composable +private fun highlightText( + text: String, + highlightPart: String, + color: Color +): AnnotatedString { + + return buildAnnotatedString { + val highlightIndex = text + .lowercase() + .indexOf(highlightPart.lowercase()) + + if (highlightIndex != -1) { + append(text.substring(0, highlightIndex)) + + withStyle( + SpanStyle(color = color) + ) { + append( + text.substring( + highlightIndex, + highlightIndex + highlightPart.length + ) + ) + } + + append( + text.substring(highlightIndex + highlightPart.length) + ) + } else { + append(text) + } + } +} \ No newline at end of file diff --git a/app/src/main/res/drawable/premium_banner_star.xml b/app/src/main/res/drawable/premium_banner_star.xml new file mode 100644 index 0000000000..49dfc6c405 --- /dev/null +++ b/app/src/main/res/drawable/premium_banner_star.xml @@ -0,0 +1,217 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 51ca10d241..6c7044e3fe 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -1023,6 +1023,12 @@ 30 minutes 1 hour + + Get Premium + Free for 7 days + Full Power + Unleash the Full Power of Unstoppable Wallet + THEME TAB SETTINGS MARKETS TAB