调用相机拍照并将图片保存到相册中
添加插件
cordova plugin add cordova-plugin-file --文件操作插件
corodva plugin add cordova-plugin-camera --拍照操作插件
在.html
文件中添加cordova.js
的引用
注意
cordova.js
文件与.html
文件的相对位置
添加调用方法
function getPicture() {
var options = {quality: 50,destinationType: Camera.DestinationType.FILE_URI,sourceType: Camera.PictureSourceType.CAMERA,encodingType: 0,mediaType: 0}navigator.camera.getPicture(onSuccess, onFail, options);function onSuccess(imageURI) {
// 拍照后将图片保存到相册中 window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs) {
function copy(currDir, srcEntry, dirName) {
currDir.getFile(srcEntry, {}, function(fileEntry) {
currDir.getDirectory(dirName, {}, function(dirEntry) {
fileEntry.copyTo(dirEntry);}, function(){
});}, function(){
});}//copy(fs.root, 'test.jpg', 'DCIM/Camera/');/** imageURI 返回路径为 file:///storage/emulated/0/Android/data/....而此处实际需要的路径为 Android/data/.....故对imageURI进行了截取 */copy(fs.root, imageURI.substring(27), 'DCIM/Camera/');}, function(){
});$("#img").attr("src",imageURI);}function onFail(message) {
}
}
2017-09-21 补充
上述代码中为了将相机拍的图片保存到相册中,使用了cordova-plugin-file
插件将图片拷贝到指定目录下,虽然上述代码实现了将图片保存到相册对应的文件中,但却无法再相册中直接显示。查阅cordova-plugin-camera
插件文档发现,通过设置getPicture()
中option
参数的saveToPhotoAlbum
属性值为true
,可以使相机拍摄的图片保存到相册中并可以直接查看
设置返回的图片路径
常量名 | 类型 | 默认值 | 描述 |
---|---|---|---|
Camera.DestinationType.DATA_URL | 数值 | 0 | 返回一个基于base64编码后的字符串 |
Camera.DestinationType.FILE_URI | 数值 | 1 | 返回一个文件url |
Camera.DestinationType.NATIVE_URI | 数值 | 2 |
设置图片来源
常量名 | 类型 | 默认值 | 描述 |
---|---|---|---|
Camera.PictureSourceType.CAMERA | 数值 | 1 | 从相机获取 |
Camera.PictureSourceType.PHOTOLIBRARY | 数值 | 0 | 从图库获取 |
Camera.PictureSourceType.SAVEDPHOTOALBUM | 数值 | 2 | 从图库获取 |
显示图片
当destinationType
=Camera.DestinationType.DATA_URL
时
<img src="data:image/jpeg;base64,imageURI" />
当destinationType
=Camera.DestinationType.FILE_URI
时
<img src="imageURI" />
此处的imageURI为getPicture()回调onSuccess()时的方法参数
Android 持久化存储路径设置
在项目根目录下的config.xml文件中添加如下配置
<preference name="AndroidPersistentFileLocation" value="Compatibility" />
AndroidPersistentFileLocation
可选的值为Internal
或Compatibility
Without this line, the File plugin will use Internal as the default. If a preference tag is present, and is not one of these values, the application will not start.
If your application has previously been shipped to users, using an older (pre- 3.0.0) version of this plugin, and has stored files in the persistent filesystem, then you should set the preference to Compatibility if your config.xml does not specify a location for the persistent filesystem. Switching the location to “Internal” would mean that existing users who upgrade their application may be unable to access their previously-stored files, depending on their device.
If your application is new, or has never previously stored files in the persistent filesystem, then the Internal setting is generally recommended.
若config.xml文件中不存在name=AndroidPersistentFileLocation
的preference
标签,则cordova-plugin-file
插件会将Internal
当做AndroidPersistentFileLocation
的默认值。
若config.xml文件中存在preference
标签,但其对应的值不在Internal
、Compatibility
这两者之间,这应用将无法启动。
若应用利用cordova-plugin-file
3.0之前的版本,且用户已在持久化文件系统中存储了文件,如果没有在config.xml
文件中指定一个持久化文件系统中的路径则应该设置name=Compatibility
的preference 标签。选择Internal
类型的路径意味着现存的用户更新应用后可能导致无法访问他们之前存储的文件,当然,这也依赖于他们的设备。
如果应用是新的或之前从未在持久化文件系统中存储文件,则推荐使用Internal
异常处理
在添加cordova-plugin-camera
插件时报如下错误:
Failed to install 'cordova-plugin-camera': CordovaError: Version of installed pl
ugin: "cordova-plugin-compat@1.0.0" does not satisfy dependency plugin requireme
nt "cordova-plugin-compat@^1.1.0". Try --force to use installed plugin as depend
ency.
解决方式:
cordova plugin remove --force cordova-plugin-compat
cordova plugin add cordova-plugin-compat
执行完上面的两条命令后在执行
cordova plugin add cordova-plugin-camera
参考资料
http://blog.csdn.net/salonzhou/article/details/28275713