Jetpack Compose 通过两个修饰符支持拖放:
dragAndDropSource:将可组合项指定为拖动手势的起点dragAndDropTarget:指定一个可组合项,用于接受拖放的数据
例如,如需让用户能够在应用中拖动图片,请创建一个图片可组合项并添加 dragAndDropSource 修饰符。如需设置放置目标,请创建另一个图片可组合项,并添加 dragAndDropTarget 修饰符。
修饰符可应用于多个拖动来源和多个放置目标。
这些修饰符使应用能够使用 ClipData 在两个或更多可组合项之间共享数据,该类可与 View 实现互操作。
指定拖动来源
如需在组件内启用拖动事件,请添加 dragAndDropSource 修饰符。此函数接受一个函数作为参数。在此函数中,使用 DragAndDropTransferData 表示可转移的数据。数据可以是远程 URI、剪贴板上的富文本数据、本地文件等,但都需要封装在 ClipData 对象中。提供纯文本,例如:
Modifier.dragAndDropSource { _ -> DragAndDropTransferData( ClipData.newPlainText( "image Url", url ) ) }
为了允许拖动操作跨越应用边界,DragAndDropTransferData 构造函数接受 flags 参数。在以下示例中,DRAG_FLAG_GLOBAL 常量指定可以将数据从一个应用拖动到另一个应用:
Modifier.dragAndDropSource { _ -> 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 } } }
如需接受来自其他应用的数据,请使用 requestDragAndDropPermission 启用接收功能,并在完成后将其释放:
val externalAppCallback = remember { object : DragAndDropTarget { override fun onDrop(event: DragAndDropEvent): Boolean { val permission = activity.requestDragAndDropPermissions(event.toAndroidDragEvent()) // Parse received data permission?.release() return true } } }
请务必注意,从 Compose 回调返回的 DragAndDropEvent 与 requestDragAndDropPermission 方法预期的不同,因此您需要先对参数调用 toAndroidDragEvent() 扩展函数,然后再将其传递给权限请求。
以下代码段演示了如何处理拖放的纯文本:
Modifier.dragAndDropTarget( shouldStartDragAndDrop = { event -> event.mimeTypes().contains(ClipDescription.MIMETYPE_TEXT_PLAIN) }, target = callback // or externalAppCallback )
如果事件被使用,回调函数应返回 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 中拖放