dragAndDropSource

Compose Modifier

Common

fun Modifier.dragAndDropSource(transferData: (Offset) -> DragAndDropTransferData?): Modifier

A Modifier that allows an element it is applied to be treated like a source for drag and drop operations. It displays the element dragged as a drag shadow.

Learn how to use Modifier.dragAndDropSource:

Parameters


transferData	A function that receives the current offset of the drag operation and returns the `DragAndDropTransferData` to be transferred. If null is returned, the drag and drop transfer won't be started.

Common

fun Modifier.dragAndDropSource(
    drawDragDecoration: DrawScope.() -> Unit,
    transferData: (Offset) -> DragAndDropTransferData?,
): Modifier

A Modifier that allows an element it is applied to be treated like a source for drag and drop operations.

Learn how to use Modifier.dragAndDropSource while providing a custom drag shadow:

Parameters


drawDragDecoration	provides the visual representation of the item dragged during the drag and drop gesture.
transferData	A function that receives the current offset of the drag operation and returns the `DragAndDropTransferData` to be transferred. If null is returned, the drag and drop transfer won't be started.

Android

Deprecated Replaced by overload with a callback for obtain a transfer data,start detection is performed by Compose itself

@ExperimentalFoundationApi
fun Modifier.dragAndDropSource(block: suspend DragAndDropSourceScope.() -> Unit): Modifier

A Modifier that allows an element it is applied to to be treated like a source for drag and drop operations. It displays the element dragged as a drag shadow.

Learn how to use Modifier.dragAndDropSource:

Parameters


block	A lambda with a `DragAndDropSourceScope` as a receiver which provides a `PointerInputScope` to detect the drag gesture, after which a drag and drop gesture can be started with `DragAndDropSourceScope.startTransfer`.

Android

Deprecated Replaced by overload with a callback for obtain a transfer data,start detection is performed by Compose itself

@ExperimentalFoundationApi
fun Modifier.dragAndDropSource(
    drawDragDecoration: DrawScope.() -> Unit,
    block: suspend DragAndDropSourceScope.() -> Unit,
): Modifier

A Modifier that allows an element it is applied to to be treated like a source for drag and drop operations.

Learn how to use Modifier.dragAndDropSource while providing a custom drag shadow:

Parameters


drawDragDecoration	provides the visual representation of the item dragged during the drag and drop gesture.
block	A lambda with a `DragAndDropSourceScope` as a receiver which provides a `PointerInputScope` to detect the drag gesture, after which a drag and drop gesture can be started with `DragAndDropSourceScope.startTransfer`.

Code Examples

TextDragAndDropSourceSample

@Composable
fun TextDragAndDropSourceSample(modifier: Modifier) {
    val label = remember { "Drag me" }
    Box(
        modifier =
            modifier
                .dragAndDropSource { _ ->
                    DragAndDropTransferData(
                        clipData = ClipData.newPlainText(label, label),
                        flags = View.DRAG_FLAG_GLOBAL,
                    )
                }
                .border(
                    border =
                        BorderStroke(
                            width = 4.dp,
                            brush = Brush.linearGradient(listOf(Color.Magenta, Color.Magenta)),
                        ),
                    shape = RoundedCornerShape(16.dp),
                )
                .padding(24.dp)
    ) {
        Text(modifier = Modifier.align(Alignment.Center), text = label)
    }
}

DragAndDropSourceWithColoredDragShadowSample

@Composable
fun DragAndDropSourceWithColoredDragShadowSample(color: Color) {
    Box(
        modifier =
            Modifier.size(56.dp).background(color = color).dragAndDropSource(
                drawDragDecoration = { drawRect(color) }
            ) { _ ->
                color.toDragAndDropTransfer()
            }
    )
}