Cordova - 文件选择插件Multiple Documents Picker的使用详解（支持多文件选择）
作者：hangge | 2022-05-16 09:02
我在之前的文章中介绍了使用 camera 插件可以选择手机里的照片或者视频（点击查看）。但如果想要选择任意类型的文件，可以使用本文介绍的 multiple documents picker 插件，通过该插件可以打开系统自带的文件管理器选择任意类型文件，并且支持多选。下面演示如何安装使用该插件。
（2）可以看到 multiple documents picker 插件已经成功添加了：
（2）效果图如下： 
1，添加插件
（1）我们要在“终端”中进入工程所在的目录，然后运行如下命令安装插件：
cordova plugin add cordova-plugin-multiple-documents-picker
（2）可以看到 multiple documents picker 插件已经成功添加了：
2，使用样例
（1）下面样例代码，点击页面上的“选择文件”按钮后，便会打开系统自带文件管理器，选择文件后将结果显示在页面上。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>hangge.com</title>
<script src="cordova.js"></script>
<script>
// 选择文件
function selectFile() {
//2表示选择所有文件，1表示只选择图片
multipleDocumentsPicker.pick(2, function(files) {
let fileArray = JSON.parse(files);
let str = "文件选择完毕，数量：" + fileArray.length;
for(file of fileArray) {
str += "<br>" + JSON.stringify(file);
}
document.getElementById("result").innerHTML=str;
}, function(error) {
document.getElementById("result").innerHTML= "文件选择失败："+ error;
});
}
</script>
</head>
<body>
<button style="font-size:23px;" onclick="selectFile()">选择文件</button>
<div id="result" style="word-break: break-all;"></div>
</body>
</html>
（2）效果图如下：
附：每次只允许选择一个文件
multiple documents picker 是多文件选择插件，也就是说每次可以选择一个或者多个文件。如果我们想要限制它每次只能选择一个文件，可以修改 com.akeo.cordova.plugin 包下的 MultipleDocumentsPicker.java 插件类，将允许多文件选择配置项设置为 false 即可。
public void chooseFile (CallbackContext callbackContext, Integer type) {
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
if(type == 1) {
intent.setType("image/*");
} else {
intent.setType("*/*");
}
intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, false); // 设置为不支持多选
Intent chooser = Intent.createChooser(intent, "Select File");
cordova.startActivityForResult(this, chooser, type);
}
全部评论（0）