Refactor CaseRow styling and text behavior
Improve the visual presentation of individual case entries by adjusting styling and text handling. This includes setting a minimum height for rows, applying consistent padding, and enabling text truncation with an ellipsis for longer oneliner descriptions.
This commit is contained in:
@@ -2,14 +2,17 @@ package com.doctate.watch.presentation
|
|||||||
|
|
||||||
import androidx.compose.foundation.layout.Arrangement
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
|
import androidx.compose.foundation.layout.PaddingValues
|
||||||
import androidx.compose.foundation.layout.fillMaxSize
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
|
import androidx.compose.foundation.layout.heightIn
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.runtime.getValue
|
import androidx.compose.runtime.getValue
|
||||||
import androidx.compose.ui.Alignment
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
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.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
import androidx.lifecycle.compose.collectAsStateWithLifecycle
|
import androidx.lifecycle.compose.collectAsStateWithLifecycle
|
||||||
import androidx.wear.compose.foundation.lazy.ScalingLazyColumn
|
import androidx.wear.compose.foundation.lazy.ScalingLazyColumn
|
||||||
@@ -62,15 +65,24 @@ fun CaseListScreen(
|
|||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
private fun CaseRow(case: CaseEntry, onTap: () -> Unit) {
|
private fun CaseRow(case: CaseEntry, onTap: () -> Unit) {
|
||||||
Card(onClick = onTap, modifier = Modifier.fillMaxWidth()) {
|
Card(
|
||||||
|
onClick = onTap,
|
||||||
|
modifier = Modifier.fillMaxWidth().heightIn(min = 48.dp),
|
||||||
|
contentPadding = PaddingValues(horizontal = 10.dp, vertical = 6.dp),
|
||||||
|
) {
|
||||||
Text(
|
Text(
|
||||||
text = formatTime(case.createdAt),
|
text = formatTime(case.createdAt),
|
||||||
style = MaterialTheme.typography.labelSmall,
|
style = MaterialTheme.typography.bodyExtraSmall,
|
||||||
|
color = MaterialTheme.colorScheme.onSurfaceVariant,
|
||||||
|
modifier = Modifier.align(Alignment.CenterHorizontally),
|
||||||
)
|
)
|
||||||
Text(
|
Text(
|
||||||
text = case.oneliner ?: "…",
|
text = case.oneliner ?: "…",
|
||||||
style = MaterialTheme.typography.bodyMedium,
|
style = MaterialTheme.typography.bodySmall,
|
||||||
modifier = Modifier.padding(top = 2.dp),
|
maxLines = 2,
|
||||||
|
overflow = TextOverflow.Ellipsis,
|
||||||
|
textAlign = TextAlign.Center,
|
||||||
|
modifier = Modifier.fillMaxWidth().padding(top = 2.dp),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user