diff --git a/spark/src/main/kotlin/com/adevinta/spark/components/image/UserAvatar.kt b/spark/src/main/kotlin/com/adevinta/spark/components/image/UserAvatar.kt index 57319508f..c5c51db43 100644 --- a/spark/src/main/kotlin/com/adevinta/spark/components/image/UserAvatar.kt +++ b/spark/src/main/kotlin/com/adevinta/spark/components/image/UserAvatar.kt @@ -82,7 +82,6 @@ internal fun SparkUserAvatar( } ) .sparkUsageOverlay() -// .clip(SparkTheme.shapes.full) .aspectRatio(1f) .graphicsLayer { compositingStrategy = CompositingStrategy.Offscreen @@ -101,14 +100,15 @@ internal fun SparkUserAvatar( } if (isOnline) { val dotSize = style.badgeSize.toPx() / 2 - val offset = style.badgeOffset.toPx() + val xOffset = style.badgeXOffset.toPx() + val yOffset = style.badgeYOffset.toPx() // Clip a white border for the content drawCircle( Color.Black, radius = dotSize, center = Offset( - x = size.width - dotSize, - y = size.height - dotSize + offset, + x = size.width - dotSize + xOffset, + y = size.height - dotSize + yOffset, ), blendMode = BlendMode.Clear, ) @@ -117,8 +117,8 @@ internal fun SparkUserAvatar( indicatorColor, radius = dotSize - style.borderSize.toPx(), center = Offset( - x = size.width - dotSize, - y = size.height - dotSize + offset, + x = size.width - dotSize + xOffset, + y = size.height - dotSize + yOffset, ), ) } @@ -172,19 +172,21 @@ public fun UserAvatar( /** * @param imageSize size of the image in [Dp] * @param badgeSize size of online badge in [Dp] - * @param badgeOffset size of the offset of the badge in [Dp] + * @param badgeXOffset size of the x offset of the badge in [Dp] + * @param badgeYOffset size of the y offset of the badge in [Dp] * @param borderSize The indicator border size in [Dp], it needs to be defined since the border mechanisms is * different than figma */ public enum class UserAvatarStyle( public val imageSize: Dp, public val badgeSize: Dp, - public val badgeOffset: Dp, + public val badgeXOffset: Dp, + public val badgeYOffset: Dp, public val borderSize: Dp, ) { - SMALL(imageSize = 32.dp, badgeSize = 8.dp, badgeOffset = (-4).dp, borderSize = 1.dp), - MEDIUM(imageSize = 40.dp, badgeSize = 10.dp, badgeOffset = (-5).dp, borderSize = 1.5.dp), - LARGE(imageSize = 64.dp, badgeSize = 16.dp, badgeOffset = (-12).dp, borderSize = 2.dp), + SMALL(imageSize = 32.dp, badgeSize = 8.dp, badgeXOffset = (-3).dp, badgeYOffset = (-3).dp, borderSize = 1.dp), + MEDIUM(imageSize = 40.dp, badgeSize = 12.dp, badgeXOffset = (-0).dp, badgeYOffset = (-4).dp, borderSize = 2.dp), + LARGE(imageSize = 64.dp, badgeSize = 16.dp, badgeXOffset = (-4).dp, badgeYOffset = (-6).dp, borderSize = 2.dp), } @Preview(