Sulkta-OSS/element-x-ada
3
0
Fork 0
Code Issues 1 Pull requests 10 Projects Releases Packages Wiki Activity Actions

Improve avatar rendering

Browse source
This commit is contained in:
Benoit Marty 2024-12-10 11:34:57 +01:00
parent 2791d23cb6
commit 8cd88e0086
1 changed files with 33 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

50
features/knockrequests/impl/src/main/kotlin/io/element/android/features/knockrequests/impl/banner/KnockRequestsBannerView.kt
View file

@ -10,7 +10,6 @@ package io.element.android.features.knockrequests.impl.banner
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.expandVertically import androidx.compose.animation.expandVertically
import androidx.compose.animation.shrinkVertically import androidx.compose.animation.shrinkVertically
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
@ -22,18 +21,20 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.drawWithContent
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.BlendMode
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.CompositingStrategy
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.tooling.preview.PreviewParameter
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.zIndex
import io.element.android.compound.theme.ElementTheme import io.element.android.compound.theme.ElementTheme
import io.element.android.compound.tokens.generated.CompoundIcons import io.element.android.compound.tokens.generated.CompoundIcons
import io.element.android.features.knockrequests.impl.KnockRequest import io.element.android.features.knockrequests.impl.KnockRequest
@ -183,23 +184,38 @@ private fun KnockRequestAvatarListView(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
) { ) {
val avatarSize = AvatarSize.KnockRequestBanner.dp val avatarSize = AvatarSize.KnockRequestBanner.dp
Row( Box(
modifier = modifier, modifier = modifier,
horizontalArrangement = Arrangement.spacedBy(-avatarSize / 2),
) { ) {
knockRequests knockRequests
.take(MAX_AVATAR_COUNT) .take(MAX_AVATAR_COUNT)
.forEachIndexed { index, knockRequest -> .reversed()
Box( .let { smallReversedList ->
contentAlignment = Alignment.Center, val lastItemIndex = smallReversedList.size - 1
modifier = Modifier smallReversedList.forEachIndexed { index, knockRequest ->
.size(size = avatarSize)
.clip(CircleShape)
.background(color = ElementTheme.colors.bgCanvasDefaultLevel1)
.zIndex(-index.toFloat()),
) {
Avatar( Avatar(
modifier = Modifier.padding(2.dp), modifier = Modifier
.padding(start = avatarSize / 2 * (lastItemIndex - index))
.graphicsLayer {
compositingStrategy = CompositingStrategy.Offscreen
}
.drawWithContent {
// Draw content and clear the pixels for the avatar on the left.
drawContent()
if (index < lastItemIndex) {
drawCircle(
color = Color.Black,
center = Offset(
x = 0f,
y = size.height / 2,
),
radius = avatarSize.toPx() / 2,
blendMode = BlendMode.Clear,
)
}
}
.size(size = avatarSize)
.padding(2.dp),
avatarData = knockRequest.getAvatarData(AvatarSize.KnockRequestBanner), avatarData = knockRequest.getAvatarData(AvatarSize.KnockRequestBanner),
) )
} }