android: show selection check badge on chat avatars
This commit is contained in:
@@ -603,3 +603,9 @@
|
||||
### Step 94 - Pinned-only drag markers in selection mode
|
||||
- Updated chats multi-select row UI: drag markers are now shown only for pinned chats.
|
||||
- Non-pinned chats no longer render reorder marker in selection mode.
|
||||
|
||||
### Step 95 - Selection badge on avatar (Telegram-like)
|
||||
- Added explicit selection indicator directly on chat avatars in multi-select mode:
|
||||
- selected chat -> colored circle with check icon,
|
||||
- unselected chat -> empty outlined circle.
|
||||
- This matches the reference behavior and makes selected rows easier to scan.
|
||||
|
||||
@@ -5,6 +5,7 @@ import androidx.activity.compose.BackHandler
|
||||
import androidx.compose.foundation.clickable
|
||||
import androidx.compose.foundation.combinedClickable
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.border
|
||||
import androidx.compose.foundation.ExperimentalFoundationApi
|
||||
import androidx.compose.foundation.layout.Arrangement
|
||||
import androidx.compose.foundation.layout.Box
|
||||
@@ -55,6 +56,7 @@ import androidx.compose.foundation.shape.CircleShape
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.ui.platform.LocalConfiguration
|
||||
import androidx.compose.ui.platform.LocalContext
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.unit.dp
|
||||
@@ -63,6 +65,7 @@ import androidx.lifecycle.compose.collectAsStateWithLifecycle
|
||||
import androidx.compose.material.icons.Icons
|
||||
import androidx.compose.material.icons.automirrored.filled.ArrowBack
|
||||
import androidx.compose.material.icons.filled.Close
|
||||
import androidx.compose.material.icons.filled.Check
|
||||
import androidx.compose.material.icons.filled.Delete
|
||||
import androidx.compose.material.icons.filled.DoneAll
|
||||
import androidx.compose.material.icons.filled.Inventory2
|
||||
@@ -1151,26 +1154,36 @@ private fun ChatRow(
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
horizontalArrangement = Arrangement.spacedBy(12.dp),
|
||||
) {
|
||||
if (!chat.avatarUrl.isNullOrBlank()) {
|
||||
AsyncImage(
|
||||
model = chat.avatarUrl,
|
||||
contentDescription = "Avatar for ${chat.displayTitle}",
|
||||
modifier = Modifier
|
||||
.size(52.dp)
|
||||
.clip(CircleShape),
|
||||
Box {
|
||||
ChatAvatar(
|
||||
chat = chat,
|
||||
size = 52.dp,
|
||||
)
|
||||
} else {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(52.dp)
|
||||
.clip(CircleShape)
|
||||
.background(MaterialTheme.colorScheme.surfaceVariant),
|
||||
contentAlignment = Alignment.Center,
|
||||
) {
|
||||
Text(
|
||||
text = chat.displayTitle.firstOrNull()?.uppercase() ?: "?",
|
||||
style = MaterialTheme.typography.titleMedium,
|
||||
)
|
||||
if (isSelecting) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.align(Alignment.BottomStart)
|
||||
.size(18.dp)
|
||||
.clip(CircleShape)
|
||||
.border(
|
||||
width = 1.dp,
|
||||
color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.22f),
|
||||
shape = CircleShape,
|
||||
)
|
||||
.background(
|
||||
if (isSelected) MaterialTheme.colorScheme.tertiary else MaterialTheme.colorScheme.surface,
|
||||
),
|
||||
contentAlignment = Alignment.Center,
|
||||
) {
|
||||
if (isSelected) {
|
||||
Icon(
|
||||
imageVector = Icons.Filled.Check,
|
||||
contentDescription = "Selected",
|
||||
tint = Color.White,
|
||||
modifier = Modifier.size(12.dp),
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Column(modifier = Modifier.weight(1f)) {
|
||||
|
||||
Reference in New Issue
Block a user