-
Notifications
You must be signed in to change notification settings - Fork 113
Open
Description
Hi there. I am trying to add a Swipe to delete (left) to each reordeble item.
Here is the way I follow, which also will help you to reproduce the issue:
@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun VerticalReorderList(
modifier: Modifier = Modifier,
vm: ReorderListViewModel,
) {
val state = rememberReorderableLazyListState(onMove = vm::moveDog, canDragOver = vm::isDogDragEnabled)
LazyColumn(
state = state.listState,
modifier = modifier.reorderable(state)
) {
itemsIndexed(vm.dogs, { _, item -> item.key }) { index, item ->
// items(vm.dogs, { item -> item.key }) { item ->
val dismissState = rememberSwipeToDismissState(
confirmValueChange = { swipeToDismissValue ->
if (swipeToDismissValue == SwipeToDismissValue.EndToStart) {
vm.onDelete(index)
true
} else
false
},
positionalThreshold = { it / 3 }
)
SwipeToDismissBox(
state = dismissState,
backgroundContent = {
Box(
Modifier
.fillMaxSize()
.background(
color = Color.Gray,
shape = RoundedCornerShape(13.dp)
),
contentAlignment = Alignment.CenterEnd
) {
Text("Delete")
}
},
enableDismissFromStartToEnd = false
) {
ReorderableItem(state, item.key) { dragging ->
val elevation = animateDpAsState(if (dragging) 8.dp else 0.dp)
Column(
modifier = Modifier
.detectReorderAfterLongPress(state)
.shadow(elevation.value)
.fillMaxWidth()
.background(MaterialTheme.colors.surface)
) {
Text(
text = item.title,
modifier = Modifier.padding(16.dp)
)
Divider()
}
}
}
}
}
}
To make it run, I added the dependancy for Material 3
implementation("androidx.compose.material3:material3:1.2.0-beta01")
and also added a method in ReorderListViewModel to delete items:
fun onDelete(index: Int) {
dogs = dogs.toMutableList().apply {
removeAt(index)
}
}
Here is a demo what happens at swipe:
Screen_recording_20240123_140229.webm
Please help to fix the issue. Many thanks in advance.
Metadata
Metadata
Assignees
Labels
No labels