Cordova(Phonegap)で、イメージをローカルに保存

カメラや写真を画面に表示して、永続的(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プラグイン

  • Spread The Love
  • Digg This Post
  • Tweet This Post
  • Stumble This Post
  • Submit This Post To Delicious
  • Submit This Post To Reddit
  • Submit This Post To Mixx

0 Response to “Cordova(Phonegap)で、イメージをローカルに保存”

Leave a Reply