Закругленные углы карт обрезаются при частичном прокрутке - как держать их округлыми на краю экрана? ⇐ Android

[Anonymous]

У меня есть список округлых «карт» (серых коробок) в лазиколонке. Когда пользователь прокручивает так, чтобы карта частично была от нижней и/или верхнего края экрана (например, частично видимого), видимое дно карты обрезается и смотрит квадрат/плоский вместо того, чтобы сохранить его округлый угол:

Ожидается: видимая часть карты остается округлой, даже если частично вне экрана.

фактическая: закругленные углы визуально подключены к прямой линии на грани экрана. /> это то, что я пробовал: < /p>

Добавление дна контента на лазиколом. Surface /Card. < /Li>
< /ul>
И это мой код: < /p>
@Composable
fun WeatherDetailScreen() {
LazyColumn(
modifier = Modifier.fillMaxSize(),
// If missing, the last card will get visually "cut"
// when it stops exactly at the bottom edge.
contentPadding = PaddingValues(
top = 16.dp,
bottom = 32.dp // try increasing or using WindowInsets.navigationBars.asPaddingValues()
),
verticalArrangement = Arrangement.spacedBy(12.dp)
) {
items(10) {
WeatherInfoCard()
}
}
}

@Composable
fun WeatherInfoCard() {
Surface(
modifier = Modifier
.padding(horizontal = 16.dp)
.fillMaxWidth()
.height(260.dp), // tall to show the issue when partially visible
shape = RoundedCornerShape(32.dp),
tonalElevation = 2.dp
) {
// Card content placeholder
Box(
Modifier
.fillMaxSize()
.background(Color(0xFF2C2C2C)),
contentAlignment = Alignment.Center
) {
Text("Card", color = Color.White)
}
}
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... -them-roun