Crosswalk Cordova Android多个文件选择 [英] Crosswalk Cordova Android multiple file select
问题描述
我有一个使用cordova和angularjs构建的混合应用程序,对于Android,我使用人行横道运行该应用程序.
I have a hybrid app built using cordova and angularjs, for Android I run the app using crosswalk.
我一直在互联网上寻找用于html5文件输入的解决方案,以允许选择多个文件.
I've been scouring the internet to find the solution for the html5 file input to allow selection of multiple files.
我正在使用以下元素进行文件选择:
I'm using the following element for file selecting:
<input type="file" multiple="multiple" name="files[]" />
我正在运行Android Lollipop版本5.1.1和Crosswalk版本20,我也已经测试过Crosswalk版本18和19.我安装了运行最新版本的设备上的Chrome,尽管我认为这没有什么不同.
I am running Android Lollipop version 5.1.1 and Crosswalk version 20, I have tested with Crosswalk version 18 and 19 also. Chrome is installed on my device running the latest version although I don't think that makes a difference.
单击上方的输入元素时,出现预期的对话框,要求我从文档"或照相机"中进行选择.如果我选择从文档"中进行选择,那么我只能选择单个文件,在这种情况下为图像.对于我可以从中选择图像的每个应用程序都是如此,因此默认的Android图像",视频",音频"等以及外部应用程序(例如Google相册)均全部允许我一次选择一个文件.
When I click the input element above I get the expected dialog asking me to select from my Documents or Camera. If I choose to select from my Documents then I am only able to select single files, in this case images. This is true for every App that I can select images from, so the default android 'Images', 'Videos', 'Audio', etc and external Apps such as Google Photos - All only allow me to select one single file at a time.
在下面的图像中,您可以看到列出的文件,长按每个图块不会将文件添加到多个选择中.
In the image below you can see the files listed, a long press on each tile does not add the file to a multiple selection.
这适用于该应用程序的IOS版本.
This works on the IOS version of the App.
在仔细阅读了所有可以在网上找到的资料之后,似乎运行Chrome 49+的Android 5+支持multiple属性.
After digging through all the material I can find online it seems that the multiple attribute is supported on Android 5+ running Chrome 49+.
我不确定这是人行横道浏览器实现还是Android操作系统问题,还是其他原因?任何人都可以建议.
I'm unsure if this is a crosswalk browser implementation or Android Operating System issue, or something else? Could anyone advise.
修改
仅需确认,无论是否使用Crosswalk,此操作均不起作用.
Just to confirm this does not work with or without using Crosswalk.
推荐答案
经过数周的尝试,我终于找到了解决方案(没有Crosswalk的Cordova).这是在Windows中使用Cordova工具完成的,因此请谅解下面的文件规范.
After weeks of trying to sort this out, I finally got it to work (Cordova without Crosswalk). This was done using Cordova Tools in Windows so please pardon the filespecs below.
步骤1:将platform \ Android \ CordovaLib \ AndroidManifest.xml中的minSdkVersion更改为21
说明:onShowFileChooser
API是LOLLIPOP(API 21)中引入的.它允许返回早期的API版本中的url[]
而不是showFileChooser
返回的url
.仅当您将API更改为21或更高版本时,该函数才会被调用.
Step 1: Change the minSdkVersion in platforms\Android\CordovaLib\AndroidManifest.xml to 21
Explanation: onShowFileChooser
API was introduced in LOLLIPOP (API 21). It allows returning url[]
instead of url
returned by showFileChooser
in earlier API versions. This gets called only when you change the API to 21 or greater.
步骤2:更新/替换onActivityResult
方法以检索多个文件.
在使用fileChooserParams
创建意图之后,添加以下内容以允许选择多个文件:
Step 2: Update/Replace the onActivityResult
method to retrieve multiple files.
Append the following after creating intent using fileChooserParams
to allow choosing multiple files:
intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true);
位置: platform \ android \ CordovaLib \ src \ org \ apache \ cordova \ engine \ SystemWebChromeClient.java
Location: platforms\android\CordovaLib\src\org\apache\cordova\engine\SystemWebChromeClient.java
步骤3:更新相应的onActivityResult
方法以使用intent.getClipData()
返回多个网址.
Step 3: Update the corresponding onActivityResult
method to return multiple urls using intent.getClipData()
.
注意事项:
- 为所有呼叫启用多重上传.您可以基于fileChooserParams模式更新意图.
- 在选择器中将相机禁用为源,默认情况下,该功能可用于人行横道.
最终密码:
Uri photoUri;
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
@Override
public boolean onShowFileChooser(WebView webView, final ValueCallback<Uri[]> filePathsCallback, final WebChromeClient.FileChooserParams fileChooserParams) {
// Check and use MIME Type.
String mimeType = "*/*";
int ACTION_CODE = FILECHOOSER_RESULTCODE;
try {
if (fileChooserParams.getAcceptTypes().length > 0) {
mimeType = fileChooserParams.getAcceptTypes()[0];
} else {
mimeType = "*/*";
}
} catch (Exception e) {
mimeType = "*/*";
};
// Check if Mutiple is specified
Boolean selectMultiple = false;
if (fileChooserParams.getMode() == WebChromeClient.FileChooserParams.MODE_OPEN_MULTIPLE) {
selectMultiple = true;
};
Intent intent = new Intent();
intent.setAction(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
if (selectMultiple) { intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true); };
intent.setType(mimeType);
ACTION_CODE = FILECHOOSER_RESULTCODE;
final Intent chooserIntent = Intent.createChooser(intent, "Select Source");
// Add camera intent to the chooser if image and send URI to return full image
if (mimeType.equals("image/*")) {
photoUri = null;
try {
File photoFile = createImageFile();
photoUri = Uri.fromFile(photoFile);
}
catch (Exception ex) {
photoUri = null;
}
if (photoUri != null) {
Intent camIntent = new Intent();
camIntent.setAction(MediaStore.ACTION_IMAGE_CAPTURE);
camIntent.putExtra(MediaStore.EXTRA_OUTPUT, photoUri);
camIntent.putExtra("return-data", true);
chooserIntent.putExtra(Intent.EXTRA_INITIAL_INTENTS, new Intent [] {camIntent} );
}
}
try {
parentEngine.cordova.startActivityForResult(new CordovaPlugin() {
@Override
public void onActivityResult(int requestCode, int resultCode, Intent intent) {
if (resultCode == Activity.RESULT_OK && intent != null) {
if (intent.getData() != null)
{
Uri[] result = WebChromeClient.FileChooserParams.parseResult(resultCode, intent);
filePathsCallback.onReceiveValue(result);
}
else
{
if (intent.getClipData() != null) {
final int numSelectedFiles = intent.getClipData().getItemCount();
Uri[] result = new Uri[numSelectedFiles];
for (int i = 0; i < numSelectedFiles; i++) {
result[i] = intent.getClipData().getItemAt(i).getUri();
}
filePathsCallback.onReceiveValue(result);
}
else {
filePathsCallback.onReceiveValue(null);
}
}
}
else if(resultCode == Activity.RESULT_OK && (intent == null || intent.getData() == null )) {
Uri[] result = new Uri[1];
result[0] = photoUri;
filePathsCallback.onReceiveValue(result);
} else {
filePathsCallback.onReceiveValue(null);
}
}
}, chooserIntent, ACTION_CODE);
} catch (ActivityNotFoundException e) {
Log.w("No activity found to handle file chooser intent.", e);
filePathsCallback.onReceiveValue(null);
}
return true;
}
这篇关于Crosswalk Cordova Android多个文件选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!