拖曳

Jetpack Compose 支援使用兩個修飾符拖曳：

舉例來說，如果想讓使用者在應用程式中拖曳圖片，請建立圖片可組合函式 並新增 dragAndDropSource 修飾符。如要設定放置目標，請建立另一個 圖片可組合函式，並新增 dragAndDropTarget 修飾符。

修飾符可套用至多個拖曳來源和多個放置目標。

修飾符可讓應用程式在兩個以上的可組合項之間共用資料 使用 ClipData，因此與 View 實作互通。

開始拖曳事件

如要在元件內啟用拖曳事件，請新增 dragAndDropSource 修飾符。 這個函式會將暫停函式做為參數這個函式會定義使用者 觸發拖曳作業的互動。dragAndDropSource 修飾符 會等待其收到指標輸入事件，然後執行 lambda 傳遞到事件處理常式。使用 lambda 偵測各種輸入事件。 例如輕觸或長按。詳情請參閱「指標 輸入

指標輸入事件通常是長按，如下所示：

Modifier.dragAndDropSource {
    detectTapGestures(onLongPress = {
        // Transfer data here.
    })
}
DragAndDropSnippets.kt

如要啟動拖曳工作階段，請呼叫 startTransfer() 函式。 在這個範圍內，使用 DragAndDropTransferData 來表示 可轉移的資料資料可以是遠端 URI 和 剪貼簿或本機檔案等，但這些都需要以 ClipData 物件。提供純文字，例如：

Modifier.dragAndDropSource {
    detectTapGestures(onLongPress = {
        startTransfer(
            DragAndDropTransferData(
                ClipData.newPlainText(
                    "image Url", url
                )
            )
        )
    })
}
DragAndDropSnippets.kt

如要讓拖曳動作跨越應用程式邊界， DragAndDropTransferData 建構函式接受 flags 引數。在 在這個範例中，DRAG_FLAG_GLOBAL 常數會指定 從一個應用程式拖曳至另一個

Modifier.dragAndDropSource {
    detectTapGestures(onLongPress = {
        startTransfer(
            DragAndDropTransferData(
                ClipData.newPlainText(
                    "image Url", url
                ),
                flags = View.DRAG_FLAG_GLOBAL
            )
        )
    })
}
DragAndDropSnippets.kt

DragAndDropTransferData 接受 Android View 系統支援的標記。詳情請見 View 常數清單，取得可用標記的完整清單。

接收掉落資料

將 dragAndDropTarget 修飾符指派給可組合函式，即可啟用該可組合函式 接收拖曳事件。修飾符有兩個參數：第一個 做為篩選器，並指定修飾符可以接受的資料類型。 第二步是在回呼中提供資料。

請注意，回呼例項應記住。下列程式碼片段 顯示如何記住回呼：

val callback = remember {
    object : DragAndDropTarget {
        override fun onDrop(event: DragAndDropEvent): Boolean {
            // Parse received data
            return true
        }
    }
}
DragAndDropSnippets.kt

下一段程式碼片段示範如何處理捨棄的純文字：

Modifier.dragAndDropTarget(
    shouldStartDragAndDrop = { event ->
        event.mimeTypes().contains(ClipDescription.MIMETYPE_TEXT_PLAIN)
    }, target = callback
)
DragAndDropSnippets.kt

如果已取用事件，回呼函式應傳回 true；反之，則傳回 false 。

處理拖曳事件

覆寫 DragAndDropTarget 介面中的回呼，以觀察 拖曳事件開始、結束，或是進入或離開元件時精確顯示 控制 UI 和應用程式行為：

object : DragAndDropTarget {
    override fun onStarted(event: DragAndDropEvent) {
        // When the drag event starts
    }

    override fun onEntered(event: DragAndDropEvent) {
        // When the dragged object enters the target surface
    }

    override fun onEnded(event: DragAndDropEvent) {
        // When the drag event stops
    }

    override fun onExited(event: DragAndDropEvent) {
        // When the dragged object exits the target surface
    }

    override fun onDrop(event: DragAndDropEvent): Boolean = true
}
DragAndDropSnippets.kt

其他資源

程式碼研究室：在 Compose 中拖曳