diff --git a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardBack.kt b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardBack.kt index aa4196bce..f772cab2a 100644 --- a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardBack.kt +++ b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardBack.kt @@ -1,9 +1,7 @@ package io.github.droidkaigi.confsched.profilecard.component -import androidx.compose.foundation.border import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.size -import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.LaunchedEffect @@ -13,7 +11,6 @@ import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.draw.drawWithCache -import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.ImageBitmap import androidx.compose.ui.graphics.graphicsLayer import androidx.compose.ui.graphics.layer.GraphicsLayer @@ -85,11 +82,6 @@ internal fun BackgroundCapturableCardBack( qrCodeImagePainter, modifier = Modifier .size(width = 300.dp, height = 380.dp) - .border( - 3.dp, - Color.Black, - RoundedCornerShape(8.dp), - ) .graphicsLayer { rotationY = 180f }, diff --git a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardFront.kt b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardFront.kt index 8cb9311c1..0e76372bb 100644 --- a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardFront.kt +++ b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/CaptureableCardFront.kt @@ -1,9 +1,7 @@ package io.github.droidkaigi.confsched.profilecard.component -import androidx.compose.foundation.border import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.size -import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.LaunchedEffect @@ -13,7 +11,6 @@ import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.draw.drawWithCache -import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.ImageBitmap import androidx.compose.ui.graphics.layer.drawLayer import androidx.compose.ui.graphics.rememberGraphicsLayer @@ -81,13 +78,7 @@ internal fun BackgroundCapturableCardFront( FlipCardFront( uiState, profileImagePainter, - modifier = Modifier - .size(width = 300.dp, height = 380.dp) - .border( - 3.dp, - Color.Black, - RoundedCornerShape(8.dp), - ), + modifier = Modifier.size(width = 300.dp, height = 380.dp), ) } } diff --git a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/ShareableCard.kt b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/ShareableCard.kt index 79816929f..3ad2bfc16 100644 --- a/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/ShareableCard.kt +++ b/feature/profilecard/src/commonMain/kotlin/io/github/droidkaigi/confsched/profilecard/component/ShareableCard.kt @@ -1,6 +1,6 @@ package io.github.droidkaigi.confsched.profilecard.component -import androidx.compose.foundation.Image +import androidx.compose.foundation.Canvas import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.offset @@ -18,8 +18,13 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.drawWithContent import androidx.compose.ui.draw.rotate +import androidx.compose.ui.geometry.CornerRadius +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.geometry.Size +import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.ImageBitmap +import androidx.compose.ui.graphics.drawscope.rotate import androidx.compose.ui.graphics.layer.GraphicsLayer import androidx.compose.ui.graphics.layer.drawLayer import androidx.compose.ui.platform.LocalDensity @@ -109,42 +114,74 @@ private fun ShareableCardContent( .background(LocalProfileCardTheme.current.primaryColor), ) { Box(modifier = Modifier.padding(vertical = with(density) { verticalPaddingPx.toDp() })) { - backImage?.let { - Image( - bitmap = it, - contentDescription = null, - modifier = Modifier - .offset( - x = with(density) { offsetXBackPx.toDp() }, - y = with(density) { offsetYBackPx.toDp() }, - ) - .rotate(10f) - .size( - width = with(density) { cardWidthPx.toDp() }, - height = with(density) { cardHeightPx.toDp() }, - ), + backImage?.let { backBitmap -> + ShadowedImage( + imageBitmap = backBitmap, + offsetX = offsetXBackPx, + offsetY = offsetYBackPx, + rotation = 10f, + cardWidthPx = cardWidthPx, + cardHeightPx = cardHeightPx, ) } - frontImage?.let { - Image( - bitmap = it, - contentDescription = null, - modifier = Modifier - .offset( - x = with(density) { offsetXFrontPx.toDp() }, - y = with(density) { offsetYFrontPx.toDp() }, - ) - .rotate(-12.2f) - .size( - width = with(density) { cardWidthPx.toDp() }, - height = with(density) { cardHeightPx.toDp() }, - ), + frontImage?.let { frontBitmap -> + ShadowedImage( + imageBitmap = frontBitmap, + offsetX = offsetXFrontPx, + offsetY = offsetYFrontPx, + rotation = -12.2f, + cardWidthPx = cardWidthPx, + cardHeightPx = cardHeightPx, ) } } } } +@Composable +private fun ShadowedImage( + imageBitmap: ImageBitmap, + offsetX: Float, + offsetY: Float, + rotation: Float, + cardWidthPx: Int, + cardHeightPx: Int, + modifier: Modifier = Modifier, +) { + val sweepGradient = Brush.sweepGradient( + colors = listOf( + Color.Black.copy(alpha = 0.1f), + Color.Transparent, + ), + ) + val density = LocalDensity.current + + Canvas( + modifier = modifier + .offset( + x = with(density) { offsetX.toDp() }, + y = with(density) { offsetY.toDp() }, + ) + .rotate(rotation) + .size( + width = with(density) { cardWidthPx.toDp() }, + height = with(density) { cardHeightPx.toDp() }, + ), + ) { + rotate(degrees = 180f) { + for (i in 1..15) { + drawRoundRect( + brush = sweepGradient, + size = Size(cardWidthPx.toFloat(), cardHeightPx.toFloat()), + topLeft = Offset(-i.toFloat(), -i.toFloat()), + cornerRadius = CornerRadius(with(density) { 16.toDp().toPx() }), + ) + } + } + drawImage(imageBitmap) + } +} + @Composable @Preview fun ShareableCardPreview() {