Update: Revamp Repos' layout

This commit is contained in:
machiav3lli 2022-09-18 15:43:49 +02:00
parent f786b73481
commit 79d3eb78b0

View File

@ -15,6 +15,7 @@ import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface import androidx.compose.material3.Surface
import androidx.compose.material3.Text import androidx.compose.material3.Text
import androidx.compose.material3.surfaceColorAtElevation
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
@ -38,7 +39,7 @@ fun RepositoryItem(
mutableStateOf(repository.enabled) mutableStateOf(repository.enabled)
} }
val backgroundColor by animateColorAsState( val backgroundColor by animateColorAsState(
targetValue = if (isEnabled) MaterialTheme.colorScheme.primaryContainer targetValue = if (isEnabled) MaterialTheme.colorScheme.surfaceColorAtElevation(32.dp)
else MaterialTheme.colorScheme.background else MaterialTheme.colorScheme.background
) )
@ -55,7 +56,7 @@ fun RepositoryItem(
onLongClick = { onLongClick(repository) } onLongClick = { onLongClick(repository) }
), ),
color = backgroundColor, color = backgroundColor,
shape = MaterialTheme.shapes.extraLarge shape = MaterialTheme.shapes.large
) { ) {
Row( Row(
modifier = Modifier.padding( modifier = Modifier.padding(
@ -65,44 +66,36 @@ fun RepositoryItem(
horizontalArrangement = Arrangement.SpaceBetween, horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {
RepositoryItemText(
repositoryName = repository.name, Column(
repositoryDescription = repository.description modifier = modifier.fillMaxWidth(0.9f),
) horizontalAlignment = Alignment.Start,
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
Text(
text = repository.name.trim(),
style = MaterialTheme.typography.titleMedium,
color = if (isEnabled) MaterialTheme.colorScheme.onPrimaryContainer
else MaterialTheme.colorScheme.onSurface,
maxLines = 1
)
repository.description.trim().let {
Text(
text = it,
style = MaterialTheme.typography.bodyMedium,
overflow = TextOverflow.Ellipsis,
color = MaterialTheme.colorScheme.onSurfaceVariant,
maxLines = 1
)
}
}
AnimatedVisibility(visible = isEnabled) { AnimatedVisibility(visible = isEnabled) {
Icon( Icon(
imageVector = Icons.Default.Done, imageVector = Icons.Default.Done,
tint = MaterialTheme.colorScheme.primary,
contentDescription = "Repository Enabled" contentDescription = "Repository Enabled"
) )
} }
} }
} }
} }
@Composable
private fun RepositoryItemText(
modifier: Modifier = Modifier,
repositoryName: String,
repositoryDescription: String?
) {
Column(
modifier = modifier.fillMaxWidth(0.9f),
horizontalAlignment = Alignment.Start,
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
Text(
text = repositoryName.trim(),
style = MaterialTheme.typography.titleMedium,
maxLines = 1
)
repositoryDescription?.trim()?.let {
Text(
text = it,
style = MaterialTheme.typography.bodyMedium,
overflow = TextOverflow.Ellipsis,
color = MaterialTheme.colorScheme.onSurfaceVariant,
maxLines = 1
)
}
}
}