Compose DND is a library that allows you to easily add drag and drop functionality to your Jetpack Compose or Compose Multiplatform projects.
Add the following dependency to your module build.gradle.kts
file:
implementation("com.mohamedrejeb.dnd:compose-dnd:0.1.0")
To implement drag and drop functionality:
- Create a
DragAndDropState
withrememberDragAndDropState
.
val dragAndDropState = rememberDragAndDropState()
- Add
DragAndDropContainer
composable which will wrap the draggable items.
DragAndDropContainer(
state = dragAndDropState,
) {
}
- Add
DraggableItem
composable for each draggable item.
DraggableItem(
state = dragAndDropState,
key = task.id, // Unique key for each draggable item
data = task, // Data to be passed to the drop target
) {
}
- Add
Modifier.dropTarget
for each drop target.
Modifier.dropTarget(
state = dragAndDropState,
key = task.id, // Unique key for each drop target
onDrop = { state -> // Data passed from the draggable item
// Handle drop
}
)
For more details, check out the sample
To implement reorder list functionality:
- Create a
ReorderState
withrememberReorderState
.
val reorderState = rememberReorderState()
- Add
ReorderContainer
composable which will wrap the reorderable items.
ReorderContainer(
state = reorderState,
) {
}
- Add
ReorderableItem
composable for each reorderable item.
ReorderableItem(
state = reorderState,
key = task.id, // Unique key for each reorderable item
data = task, // Data to be passed to the drop target
onDrop = { state -> // Data passed from the draggable item
// Handle drop
}
) {
}
The ReorderableItem
composable is at the same time a DraggableItem
and a dropTarget
.
For more details, check out the sample
If you've found an error in this sample, please file an issue.
Feel free to help out by sending a pull request ❤️.
Support it by joining stargazers for this repository. ⭐
Also, follow me on GitHub for more libraries! 🤩
Copyright 2023 Mohamed Rejeb
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
https://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.