カメラや写真を画面に表示して、永続的(PERSISTENT)に保存するサンプルです。
(Cordova 3.4.1、Androidの場合)
fileプラグイン
イメージをPERSISTENTに保存するためには、ファイル関係の操作が必要になります。コマンドラインからfileプラグインを導入しておきます。
cordova plugin org.apache.cordova.file
コーディング例
// id="camera_button"の箇所がタッチされた場合
$('#camera_button').touchend( function() {
getImage( 'camera' );
}
// id="album_button"の箇所がタッチされた場合
$('#album_button').touchend( function() {
getImage( 'album' );
}
function getImage( type ) {
if(type == 'camera') {
var options = {
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.CAMERA,
encodingType: Camera.EncodingType.PNG,
quality: 70
};
}else if(type == 'album'){
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM, // Androidでは、SAVEDPHOTOALBUMとPHOTOLIBRARYは同じ
encodingType: Camera.EncodingType.PNG,
quality: 70
};
}
// カメラ(ギャラリー)を起動
navigator.camera.getPicture( camera_success, camera_error, options );
}
function camera_success(uri) {
// uriのFileSystemオブジェクトを取得
window.resolveLocalFileSystemURI( uri, resolve_success, file_error );
}
function resolve_success(entry) {
var d = new Date();
var n = d.getTime(); // ミリ秒
var newFileName = n + ".png"; // ミリ秒でファイル名を付ければダブらない。たぶん。
var myFolderApp = "com.example"; // イメージの保存先
// (1)PERSISTENTのFileSystemオブジェクトを取得
// (2)myFolderAppというディレクトリを取得(なければ作成)
// (3)myFolderAppにファイルをコピー
window.requestFileSystem( LocalFileSystem.PERSISTENT, 0, function( fileSys ) {
fileSys.root.getDirectory( myFolderApp,
{create: true, exclusive: false},
function( directory ) {
entry.copyTo( directory, newFileName, move_success, file_error );
},
file_error );
},
file_error );
}
function move_success(entry) {
// id="image"のIMGに画像を表示
$('#image').attr('src', entry.toNativeURL());
// 以下、データベースやローカルストレージに保存
}
function file_error(error) {
alert('File System Error:' + error.code);
}
function camera_error(message) {
alert('Camera Error:' + message);
}
カメラやファイル操作は、iOS, Androidその他で振る舞いが微妙に違うようです。
cameraプラグイン
fileプラグイン






