[#1038] Primary button has colored shadow background

* [#1038] Primary button has colored shadow bg

- Closes #1038
- Also improves share_file_provider_paths content for exporting private data feature

* Reorder parameters
This commit is contained in:
Honza Rychnovský 2023-11-14 16:00:00 +01:00 committed by GitHub
parent 494d068168
commit 6aa8094ed7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 63 additions and 46 deletions

View File

@ -1,6 +1,5 @@
package co.electriccoin.zcash.ui.design.component package co.electriccoin.zcash.ui.design.component
import android.graphics.BlurMaskFilter
import androidx.compose.animation.core.animateFloatAsState import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.core.tween import androidx.compose.animation.core.tween
import androidx.compose.foundation.border import androidx.compose.foundation.border
@ -74,13 +73,12 @@ fun PrimaryButton(
modifier = modifier modifier = modifier
.padding(outerPaddingValues) .padding(outerPaddingValues)
.shadow( .shadow(
ZcashTheme.colors.buttonShadowColor, contentColor = textColor,
borderRadius = 0.dp, strokeColor = buttonColor,
strokeWidth = 1.dp,
offsetX = ZcashTheme.dimens.shadowOffsetX, offsetX = ZcashTheme.dimens.shadowOffsetX,
offsetY = ZcashTheme.dimens.shadowOffsetY, offsetY = ZcashTheme.dimens.shadowOffsetY,
spread = ZcashTheme.dimens.shadowSpread, spread = ZcashTheme.dimens.shadowSpread,
blurRadius = 0.dp,
stroke = textColor != MaterialTheme.colorScheme.primary,
) )
.translationClick( .translationClick(
translationX = ZcashTheme.dimens.shadowOffsetX + 6.dp, // + 6dp to exactly cover the bottom shadow translationX = ZcashTheme.dimens.shadowOffsetX + 6.dp, // + 6dp to exactly cover the bottom shadow
@ -89,7 +87,7 @@ fun PrimaryButton(
.defaultMinSize(ZcashTheme.dimens.defaultButtonWidth, ZcashTheme.dimens.defaultButtonHeight) .defaultMinSize(ZcashTheme.dimens.defaultButtonWidth, ZcashTheme.dimens.defaultButtonHeight)
.border(1.dp, Color.Black), .border(1.dp, Color.Black),
colors = buttonColors( colors = buttonColors(
buttonColor, containerColor = buttonColor,
disabledContainerColor = ZcashTheme.colors.disabledButtonColor, disabledContainerColor = ZcashTheme.colors.disabledButtonColor,
disabledContentColor = ZcashTheme.colors.disabledButtonTextColor disabledContentColor = ZcashTheme.colors.disabledButtonTextColor
), ),
@ -124,13 +122,11 @@ fun SecondaryButton(
modifier = modifier modifier = modifier
.padding(outerPaddingValues) .padding(outerPaddingValues)
.shadow( .shadow(
ZcashTheme.colors.buttonShadowColor, contentColor = textColor,
borderRadius = 0.dp, strokeColor = textColor,
offsetX = ZcashTheme.dimens.shadowOffsetX, offsetX = ZcashTheme.dimens.shadowOffsetX,
offsetY = ZcashTheme.dimens.shadowOffsetY, offsetY = ZcashTheme.dimens.shadowOffsetY,
spread = ZcashTheme.dimens.shadowSpread, spread = ZcashTheme.dimens.shadowSpread,
blurRadius = 0.dp,
stroke = textColor != MaterialTheme.colorScheme.primary,
) )
.translationClick( .translationClick(
translationX = ZcashTheme.dimens.shadowOffsetX + 6.dp, // + 6dp to exactly cover the bottom shadow translationX = ZcashTheme.dimens.shadowOffsetX + 6.dp, // + 6dp to exactly cover the bottom shadow
@ -139,7 +135,7 @@ fun SecondaryButton(
.defaultMinSize(ZcashTheme.dimens.defaultButtonWidth, ZcashTheme.dimens.defaultButtonHeight) .defaultMinSize(ZcashTheme.dimens.defaultButtonWidth, ZcashTheme.dimens.defaultButtonHeight)
.border(1.dp, Color.Black), .border(1.dp, Color.Black),
colors = buttonColors( colors = buttonColors(
buttonColor, containerColor = buttonColor,
disabledContainerColor = ZcashTheme.colors.disabledButtonColor, disabledContainerColor = ZcashTheme.colors.disabledButtonColor,
disabledContentColor = ZcashTheme.colors.disabledButtonTextColor disabledContentColor = ZcashTheme.colors.disabledButtonTextColor
), ),
@ -245,45 +241,51 @@ fun DangerousButton(
@Suppress("LongParameterList") @Suppress("LongParameterList")
fun Modifier.shadow( fun Modifier.shadow(
color: Color = Color.Black, contentColor: Color = Color.Black,
borderRadius: Dp = 0.dp, strokeColor: Color = Color.Black,
blurRadius: Dp = 0.dp, strokeWidth: Dp = 2.dp,
offsetY: Dp = 0.dp, offsetY: Dp = 0.dp,
offsetX: Dp = 0.dp, offsetX: Dp = 0.dp,
spread: Dp = 0f.dp, spread: Dp = 0f.dp,
stroke: Boolean = true,
modifier: Modifier = Modifier modifier: Modifier = Modifier
) = this.then( ) = this.then(
modifier.drawBehind { modifier.drawBehind {
this.drawIntoCanvas { this.drawIntoCanvas {
val paint = Paint() val strokePaint = Paint()
if (stroke) { strokePaint.style = PaintingStyle.Stroke
paint.style = PaintingStyle.Stroke strokePaint.strokeWidth = strokeWidth.toPx()
paint.strokeWidth = 2f
paint.color = Color.Black
}
val frameworkPaint = paint.asFrameworkPaint()
val spreadPixel = spread.toPx()
val leftPixel = (0f - spreadPixel) + offsetX.toPx()
val topPixel = (0f - spreadPixel) + offsetY.toPx()
val rightPixel = (this.size.width + spreadPixel)
val bottomPixel = (this.size.height + spreadPixel)
if (blurRadius != 0.dp) { val contentPaint = Paint()
frameworkPaint.maskFilter = strokePaint.style = PaintingStyle.Fill
(BlurMaskFilter(blurRadius.toPx(), BlurMaskFilter.Blur.NORMAL))
// Reusable inner function to be able to reach modifier and canvas properties
fun drawShadowLayer(
paint: Paint,
color: Color,
paddingWidth: Float
) {
val frameworkPaint = paint.asFrameworkPaint()
val spreadPixel = spread.toPx()
val leftPixel = (0f - spreadPixel) + offsetX.toPx()
val topPixel = (0f - spreadPixel) + offsetY.toPx()
val rightPixel = (this.size.width + spreadPixel)
val bottomPixel = (this.size.height + spreadPixel)
frameworkPaint.color = color.toArgb()
it.drawRoundRect(
left = leftPixel + paddingWidth,
top = topPixel + paddingWidth,
right = rightPixel - paddingWidth,
bottom = bottomPixel - paddingWidth,
radiusX = 0f,
radiusY = 0f,
paint
)
} }
frameworkPaint.color = color.toArgb() // Draw stroke and then content paints
it.drawRoundRect( drawShadowLayer(strokePaint, strokeColor, 0f)
left = leftPixel, drawShadowLayer(contentPaint, contentColor, strokeWidth.toPx())
top = topPixel,
right = rightPixel,
bottom = bottomPixel,
radiusX = borderRadius.toPx(),
radiusY = borderRadius.toPx(),
paint
)
} }
} }
) )

View File

@ -34,7 +34,7 @@ data class Dimens(
// In screen custom spacings: // In screen custom spacings:
val inScreenZcashLogoHeight: Dp, val inScreenZcashLogoHeight: Dp,
val inScreenZcashLogoWidth: Dp, val inScreenZcashLogoWidth: Dp,
val inScreenZcashTextLogoHeight: Dp val inScreenZcashTextLogoHeight: Dp,
) )
private val defaultDimens = Dimens( private val defaultDimens = Dimens(
@ -54,7 +54,7 @@ private val defaultDimens = Dimens(
topAppBarZcashLogoHeight = 24.dp, topAppBarZcashLogoHeight = 24.dp,
inScreenZcashLogoHeight = 100.dp, inScreenZcashLogoHeight = 100.dp,
inScreenZcashLogoWidth = 60.dp, inScreenZcashLogoWidth = 60.dp,
inScreenZcashTextLogoHeight = 30.dp inScreenZcashTextLogoHeight = 30.dp,
) )
private val normalDimens = defaultDimens private val normalDimens = defaultDimens

View File

@ -87,7 +87,7 @@ internal val SecondaryTypography = Typography(
headlineSmall = TextStyle( headlineSmall = TextStyle(
fontFamily = ArchivoFontFamily, fontFamily = ArchivoFontFamily,
fontWeight = FontWeight.Bold, fontWeight = FontWeight.Bold,
fontSize = 18.sp, fontSize = 20.sp,
textAlign = TextAlign.Center textAlign = TextAlign.Center
), ),
bodyLarge = TextStyle( bodyLarge = TextStyle(

View File

@ -1,6 +1,21 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<paths> <paths>
<!-- Android Studio complains about root-path. Search for an alternative way of approaching no_backup folder --> <!-- Android Studio complains about root-path. Search for an alternative way of approaching no_backup folder -->
<root-path name="root" path="/data/data/co.electriccoin.zcash.debug/no_backup/co.electricoin.zcash/." /> <!-- Another way is to split paths into packages depending on current build type -->
<root-path name="root" path="/data/data/co.electriccoin.zcash/no_backup/co.electricoin.zcash/." /> <root-path
name="root_mainnet_release"
path="/data/data/co.electriccoin.zcash/no_backup/co.electricoin.zcash/."
/>
<root-path
name="root_mainnet_debug"
path="/data/data/co.electriccoin.zcash.debug/no_backup/co.electricoin.zcash/."
/>
<root-path
name="root_testnet_release"
path="/data/data/co.electriccoin.zcash.testnet/no_backup/co.electricoin.zcash/."
/>
<root-path
name="root_testnet_debug"
path="/data/data/co.electriccoin.zcash.testnet.debug/no_backup/co.electricoin.zcash/."
/>
</paths> </paths>

View File

@ -13,6 +13,6 @@
<string name="security_warning_acknowledge">I acknowledge</string> <string name="security_warning_acknowledge">I acknowledge</string>
<string name="security_warning_back_content_description">Back</string> <string name="security_warning_back_content_description">Back</string>
<string name="security_warning_header">Security warning:</string> <string name="security_warning_header">Security warning:</string>
<string name="security_warning_back">back</string> <string name="security_warning_back">Back</string>
<string name="security_warning_unable_to_web_browser">Unable to find a web browser app.</string> <string name="security_warning_unable_to_web_browser">Unable to find a web browser app.</string>
</resources> </resources>