В gif при первой фильтрации элемента 1 и второй фильтрации элемента 3 не анимируется затухание.

Это ViewModel и фильтрация, большая часть кода опущена
class SomeViewModel : ViewModel() {
private val list = listOf(
SomeData(id = "1", value = "Row1"),
SomeData(id = "2", value = "Row2"),
SomeData(id = "3", value = "Row3"),
SomeData(id = "4", value = "Row4"),
SomeData(id = "5", value = "Row5")
)
var itemList by mutableStateOf(list)
var filter: Int = 0
fun filter() {
if (filter % 3 == 0) {
itemList = listOf(
list[0],
list[1],
list[2]
)
} else if (filter % 3 == 1) {
itemList = listOf(
list[1],
list[2]
)
} else {
itemList = listOf(
list[0],
list[2],
list[3]
)
}
filter++
}
}
data class SomeData(val id: String, val value: String)
Компонуемый объект, содержащий элементы и анимацию после того, как фильтрация вступит в силу.
@Composable
private fun StaggeredList(
filter: String,
itemList: List,
) {
BoxWithConstraints(
modifier = Modifier
) {
val itemWidth = (maxWidth - 8.dp) / 2
FlowRow(
modifier = Modifier,
maxItemsInEachRow = 2,
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
itemList.forEachIndexed { index, it ->
key(it.id) {
var visible by remember {
mutableStateOf(false)
}
LaunchedEffect(filter) {
visible = false
delay(2000)
visible = true
}
AnimatedVisibility(
visible = visible,
enter = fadeIn(tween(2000)),
exit = fadeOut(tween(2000))
) {
MyRow(
modifier = Modifier.size(itemWidth, 200.dp),
item = it
)
}
}
}
}
}
}
Остальная часть кода для воспроизведения проблемы
@Preview
@Composable
private fun FlowRowCompositionPreview() {
val viewModel = viewModel()
MyComposable(viewModel)
}
@Composable
fun MyComposable(someViewModel: SomeViewModel) {
Column(modifier = Modifier.fillMaxSize().background(backgroundColor)) {
val itemList = someViewModel.itemList
LazyColumn(
modifier = Modifier.fillMaxSize(),
verticalArrangement = Arrangement.spacedBy(8.dp),
contentPadding = PaddingValues(16.dp)
) {
items(5) {
Box(
modifier = Modifier
.background(Color.Red, RoundedCornerShape(16.dp))
.fillMaxWidth().height(100.dp)
)
}
item {
Button(
modifier = Modifier.padding(16.dp).fillMaxWidth(),
onClick = {
someViewModel.filter()
}
) {
Text("Filter")
}
}
item {
StaggeredList(
filter = someViewModel.filter.toString(),
itemList = itemList
)
}
}
}
}
Подробнее здесь: https://stackoverflow.com/questions/792 ... but-only-f
Мобильная версия