关于cordova-plugin-image-picker
这是ionic官方提供的多图选择器插件,但是从ionic1.0到现在最新版本ionic3.9.2这个插件的样式都没有改过,如下图所示(Android界面):
看到这样的界面我也是醉了,在iOS里可以按照目录选择图片,用户还可以接受。但是在Android里这样子怎么能忍,接下来我把这个插件修改一下,还加上了预览、删除、双指缩放效果。只需要修改android代码就可以,js获取到的路径格式和以前一样,不需修改。先看下修改过后的效果图,如下所示:
代码实现
1.在gradle里添加 com.foamtrace:photopicker:1.0依赖库
2.在colors.xml里添加
3.在styles.xml里添加
4.替换ImagePicker.java代码为
/**
* @author:刘武昌
*/
package com.synconset;
import android.app.Activity;
import android.content.Intent;
import com.foamtrace.photopicker.ImageConfig;
import com.foamtrace.photopicker.PhotoPickerActivity;
import com.foamtrace.photopicker.SelectModel;
import com.foamtrace.photopicker.intent.PhotoPickerIntent;
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaPlugin;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import java.util.ArrayList;
public class ImagePickerextends CordovaPlugin {
public static StringTAG ="ImagePicker";
private static final int REQUEST_CAMERA_CODE =11;
private CallbackContextcallbackContext;
private JSONObjectparams;
public boolean execute(String action, final JSONArray args, final CallbackContext callbackContext)throws JSONException {
this.callbackContext = callbackContext;
this.params = args.getJSONObject(0);
if (action.equals("getPictures")) {
imageChoose();
}
return true;
}
public void imageChoose() {
ImageConfig config =new ImageConfig();
config.minHeight =400;
config.minWidth =400;
config.mimeType =new String[]{"image/jpeg", "image/png"};
PhotoPickerIntent intent =new PhotoPickerIntent(cordova.getActivity());
intent.setSelectModel(SelectModel.MULTI);
intent.setMaxTotal(9); // 最多选择照片数量,默认为9
this.cordova.startActivityForResult(this,intent, REQUEST_CAMERA_CODE);
}
public void onActivityResult(int requestCode, int resultCode, Intent data) {
if (resultCode == Activity.RESULT_OK && data !=null) {
switch (requestCode) {
// 选择照片
case REQUEST_CAMERA_CODE:
ArrayList fileNames =data.getStringArrayListExtra(PhotoPickerActivity.EXTRA_RESULT);
JSONArray res =new JSONArray(fileNames);
this.callbackContext.success(res);
break;
}
}else if (resultCode == Activity.RESULT_CANCELED && data !=null) {
String error = data.getStringExtra("ERRORMESSAGE");
this.callbackContext.error(error);
}else if (resultCode == Activity.RESULT_CANCELED) {
JSONArray res =new JSONArray();
this.callbackContext.success(res);
}else {
this.callbackContext.error("No images selected");
}
}
}