Cordova - 使用Cordova开发iOS应用实战5（获取手机里照片，并编辑）

使用Cordova可以很方便的通过js代码读取系统相簿里面的照片，同使用设备摄像头拍照一样，同样需要先添加camera插件。

一，添加camera插件

首先我们要在“终端”中进入工程所在的目录，然后运行如下命令：

1	`cordova plugin add cordova-plugin-camera`

可以看到camera相机插件已经成功添加了：

二，获取照片

我们可以选择是从“照片库（时刻）”中读取图片，或者从“相簿”中读取图片。

1，从“相簿”中获取照片

<!DOCTYPE html>

<html>

<head>

<title>Capture Photo</title>

<meta http-equiv="Content-type" content="text/html; charset=utf-8">

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>

<script type="text/javascript" charset="utf-8">

var pictureSource;

var destinationType;

document.addEventListener("deviceready",onDeviceReady,false);

//Cordova加载完成会触发

function onDeviceReady() {

pictureSource=navigator.camera.PictureSourceType;

destinationType=navigator.camera.DestinationType;

}

//获取照片

function getPhoto(source) {

//quality : 图像的质量，范围是[0,100]

navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,

destinationType: destinationType.FILE_URI,

sourceType: source });

}

//获取照片成功

function onPhotoURISuccess(imageURI) {

//打印出照片路径

console.log(imageURI);

var largeImage = document.getElementById('largeImage');

largeImage.style.display = 'block';

largeImage.src = imageURI;

}

//获取照片是吧

function onFail(message) {

alert('获取失败: ' + message);

}

</script>

</head>

<body style="padding-top:50px">

<button style="font-size:23px;" onclick="getPhoto(pictureSource.PHOTOLIBRARY);">

从“相簿”中获取照片

</button> <br>

<img style="display:none;" id="largeImage" src="" />

</body>

</html>

2，从“照片库（时刻）”中获取照片