---
title: "dragAndDropSource"
description: "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]:"
type: "modifier"
---

<div class='type'>Compose Modifier</div>

<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


```kotlin
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. |




<div class='sourceset sourceset-common'>Common</div>


```kotlin
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. |




<div class='sourceset sourceset-android'>Android</div>


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

```kotlin
@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`. |




<div class='sourceset sourceset-android'>Android</div>


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

```kotlin
@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
### DragAndDropSourceWithColoredDragShadowSample
```kotlin
@Composable
fun DragAndDropSourceWithColoredDragShadowSample(color: Color) {
    Box(
        modifier =
            Modifier.size(56.dp).background(color = color).dragAndDropSource(
                drawDragDecoration = { drawRect(color) }
            ) { _ ->
                color.toDragAndDropTransfer()
            }
    )
}
```
### TextDragAndDropSourceSample
```kotlin
@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)
    }
}
```