我创建了一个 LazyColumn 站,当文本连续很长时,它会剪切文本,即使我指定overflow = TextOverflow.Ellipsis
. 我该如何解决?
@Composable
fun StationsList(stations: List<StationAqi>) {
LazyColumn(
contentPadding = PaddingValues(horizontal = 16.dp, vertical = 8.dp),
verticalArrangement = Arrangement.spacedBy(4.dp),
) {
stations.map { station ->
item {
StationListItem(station = station)
}
}
}
}
@Composable
fun StationListItem(station: StationAqi) {
LazyRow(
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = CenterVertically,
modifier = Modifier.padding(horizontal = 0.dp, vertical = 8.dp)
) {
item {
Surface(
color = colorFromAqi(station.aqi),
shape = MaterialTheme.shapes.medium,
) {
Box(
modifier = Modifier
.defaultMinSize(44.dp, Dp.Unspecified)
.padding(PaddingValues(horizontal = 8.dp, vertical = 4.dp)),
contentAlignment = Center,
) {
Text(
text = station.aqi,
textAlign = TextAlign.Center,
overflow = TextOverflow.Ellipsis,
)
}
}
}
item {
Text(text = station.station.name)
}
}
}
data class StationAqi(
val uid: Int,
val lat: Double,
val lon: Double,
val aqi: String,
val station: Station
)
data class Station(
val name: String,
val time: String
)
@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
ZephyrTheme {
StationsList(listOf(
StationAqi(1, 1.0, 1.0, "2", Station("Oakland-Laney College, Alameda, California", "2022-01-07T16:00:00-08:00")),
StationAqi(2, 1.0, 1.0, "45", Station("San Pablo-Rumrill, Contra Costa, California", "2022-01-07T16:00:00-08:00")),
StationAqi(3, 1.0, 1.0, "122", Station("San Francisco CA","2022-01-07T16:00:00-08:00")),
StationAqi(4, 1.0, 1.0, "245", Station("Palo Alto CA", "2022-01-07T16:00:00-08:00"))
))
}
}
@Preview()
@Composable
fun StationListItemPreview() {
ZephyrTheme {
StationListItem(station = StationAqi(1, 1.0, 1.0, "2", Station("Oakland-Laney College, Alameda, California", "2022-01-07T16:00:00-08:00")))
}
}