拖放

Jetpack Compose 支持使用以下两个修饰符进行拖放:

例如,若要让用户能够在应用中拖动图片,请创建 image 可组合项并添加 dragAndDropSource 修饰符。如需设置拖放目标,请再创建一个图片可组合项,并添加 dragAndDropTarget 修饰符。

修饰符可以应用于多个拖动源和多个放置目标。

借助这些修饰符,应用可以使用 ClipData(可与 View 实现互操作)在两个或多个可组合项之间共享数据。

开始拖动事件

如需在组件内启用拖动事件,请添加 dragAndDropSource 修饰符,它将挂起函数作为参数。该函数定义启动拖动操作的用户互动。dragAndDropSource 修饰符将等待,直到收到指针输入事件,然后执行传递给事件处理程序的 lambda。使用 lambda 检测各种输入事件,例如点按或长按。如需了解详情,请参阅 Compose 中的指针输入

指针输入事件通常是长按,如下所示:

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

如需启动拖放会话,请调用 startTransfer() 函数。在此范围内,使用 DragAndDropTransferData 来表示可转移的数据。数据可以是远程 URI、剪贴板上的富文本数据、本地文件等等,但它们都需要封装在 ClipData 对象中。请提供纯文本,例如:

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

若要允许拖动操作跨越应用的边框,DragAndDropTransferData 构造函数会接受 flags 参数。在以下示例中,DRAG_FLAG_GLOBAL 常量指定可以将数据从一个应用拖动到另一个应用:

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

DragAndDropTransferData 接受 Android View 系统支持的标志。如需查看可用标志的详尽列表,请参阅 View 常量列表。

接收丢弃数据

dragAndDropTarget 修饰符分配给某个可组合项,使该可组合项能够接收拖放事件。该修饰符有两个参数:第一个用作过滤器,指定修饰符可以接受的数据类型,第二个参数在回调中传递数据。

请注意,您应记住回调实例。以下代码段展示了如何记住回调:

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

下一个代码段演示了如何处理用户拖放的纯文本:

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

如果事件被使用,回调函数应返回 true;如果事件被拒绝且未传播到父组件,则回调函数应返回 false

处理拖放事件

替换 DragAndDropTarget 接口中的回调,以观察拖放事件何时开始、结束、进入或退出组件,从而精确控制界面和应用的行为:

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
}

其他资源

Codelab:在 Compose 中拖放