1,使用cordova-plugin-image-picker插件。
cordova plugin add https://github.com/wymsee/cordova-imagePicker.git
2,在相应的controller里添加方法。 我这里是写在一个util中,调用即可。
//图片选择
imagePick: function (p_width, p_height) {
var q = $q.defer();
var ret = [];
var options = {
maximumImagesCount: 1,
width: p_width,
height: p_height,
quality: 100
};
$cordovaImagePicker.getPictures(options)
.then(function (results) {
q.resolve(results[0]);
}, function (error) {
// error getting photos
});
return q.promise;
},
3,页面中的调用。
<div ng-click="selectImageByPic()">
<a class="button z_chatAddPic" href=""></a>
<p style="text-align: center;">照片</p>
</div>
这样基本可以完成图片的上传和显示了。但是会发现显示的是英文字母。
4,修改选择图片时,英文变成中文显示 找到目录platforms/android/res有国际化的几个文件夹
values-de
values-es
values-fr
values-hu
values-ja
values-ko
复制其中一个文件夹,修改为values-zh,然后修改其中的xml文件为multiimagechooser_strings_zh.xml。 打开multiimagechooser_strings_zh.xml文件,替换成如下内容即可。
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="multi_app_name">图片选择器</string>
<string name="free_version_label">免费版本 - 剩余图片: %d</string>
<string name="error_database">打开相册出现错误.</string>
<string name="requesting_thumbnails">请稍后...</string>
<string name="processing_images_header">图像选择</string>
<string name="processing_images_message">这可能是一个短暂的瞬间的时间.</string>
<string name="maximum_selection_count_error_header">Auswahllimit erreicht</string>
<string name="maximum_selection_count_error_message">Sie können maximal %d Bilder auf einmal auswählen.</string>
<string name="discard">取消</string>
<string name="done">确定</string>
</resources>
5,修改源码文件platforms/android/src/com/synconset/MultiImageChooserActivity.java第175行开始
progress = new ProgressDialog(this);
progress.setTitle("图片处理");
progress.setMessage("请稍后...");
这样就算是修改完成了,由于也是产品那边要求修改,所以网上查了些资料和博客,整理一下,方便其他有同样需求的同学。