nickking 2016-05-28
在使用ionic默认的照片选择器,只能单选一个照片,不是很方便,所以一般使用cordova-plugin-image-picker插件。
第一步要将插件添加到项目,进入项目目录,运行
ionic plugin add cordova-plugin-image-picker
第二步在相应的controller里面添加方法,具体参数含义可以搜索一下
$scope.image_list = []; $scope.pictureLibrary=function(){ var options = { maximumImagesCount: 10, width: 800, height: 800, quality: 80 }; $cordovaImagePicker.getPictures(options) .then(function (results) { $scope.image_list = results; }, function(error) { // error getting photos alert("error"+error); }); };
第三步是在页面进行调用,以及图片预览
<button class="button button-assertive" ng-click="pictureLibrary()"> 相册 </button>
<ion-list> <div class="row row-wrap"> <div class="col col-20" ng-repeat="image in image_list"> <img src={{image}} width="100%"/> </div> </div> </ion-list>
前三步已经可以正常使用了,但是你会发现,它的按钮以及提示都是用的英文,如果你觉得不影响,那到第三步就可以结束了,如果想改成中文,那么还需要以下几步。
第四步,找到目录platforms/android/res有国际化的几个文件夹
values-de values-es values-fr values-hu values-ja values-ko
看到这里我想,你可能已经会了,就是复制一个文件夹并改名values-zh,里面相应的文件multiimagechooser_strings_ko.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="discard">取消</string> <string name="done">确定</string> </resources>
第五步,修改源码文件platforms/android/src/com/synconset/MultiImageChooserActivity.java第175行开始(不同版本行数可能不一致),搜索一下
progress = new ProgressDialog(this); progress.setTitle("图片处理"); progress.setMessage("请稍后。。。");
这样基本上就修改完成了,我步骤写的感觉还是比较详细的,但是不了解ionic开发以及目录结构的可能还是没那么容易看懂,使用本身并没有多复杂,只要细心就很容易完成,很少发博客,希望大家指正。