Skip to content

compose文件拖放

Published:

简单记录一下,后续完善成组件

// 文件列表
var fileList by remember { mutableStateOf(listOf<String>()) }
// 显示拖放边框
var showTargetBorder by remember { mutableStateOf(false) }
// 拖放对象
val dragAndDropTarget = remember {
    object : DragAndDropTarget {
        override fun onStarted(event: DragAndDropEvent) {
            showTargetBorder = true
        }

        override fun onEnded(event: DragAndDropEvent) {
            showTargetBorder = false
        }
        override fun onDrop(event: DragAndDropEvent): Boolean {
            event.awtTransferable.let {
                fileList = (it.getTransferData(DataFlavor.javaFileListFlavor) as List<*>).map { it.toString() }
            }
            return true
        }
    }
}
Box(Modifier.size(480.dp, 360.dp)) {
    Column(
        modifier = Modifier.align(Alignment.Center).offset(y = 40.dp)
            .padding(horizontal = 80.dp, vertical = 40.dp)
    ) {
        Surface(
            modifier = Modifier.size(480.dp, 360.dp).clickable {
                val f = JFileChooser()
                f.fileSelectionMode = JFileChooser.FILES_ONLY
                f.isMultiSelectionEnabled = true
                f.dialogTitle = "选择文件"
                f.approveButtonText = "确定"
                if (Setting.lastestPath.isNotEmpty() && Path(Setting.lastestPath).exists()) {
                    f.currentDirectory = File(Setting.lastestPath)
                }
                if (f.showOpenDialog(ComposeWindow()) == JFileChooser.APPROVE_OPTION) {
                    fileList = f.selectedFiles.map { it.absolutePath }
                }
            }.dragAndDropTarget(shouldStartDragAndDrop = { true }, target = dragAndDropTarget),
            shape = RoundedCornerShape(12.dp),
            border = BorderStroke(
                1.dp,
                if (showTargetBorder) MaterialTheme.colorScheme.onPrimary else MaterialTheme.colorScheme.surfaceVariant
            )
        ) {
            Box(modifier = Modifier.fillMaxSize()) {
                Text("拖入或打开文件", modifier = Modifier.align(Alignment.Center))
            }
        }
    }
}       

实现效果

image-20250909152259850


Next Post
compose列表选择