【Cordova】カメラを起動orギャラリーから写真を選択するプラグイン「cordova-plugin-camera」

村上 著者:村上

【Cordova】カメラを起動orギャラリーから写真を選択するプラグイン「cordova-plugin-camera」

ちょっと今更な感じはありますが、アプリでカメラを起動する、またはギャラリーから写真を選択できる「cordova-plugin-camera」のご紹介です。

GitHubのページは下記からどうぞ。

GitHub – apache/cordova-plugin-camera: Apache Cordova Plugin camera
https://github.com/apache/cordova-plugin-camera

Qiitaの記事ではこちらがおすすめです。

[*Cordova*] カメラプラグインを使ってみる – Qiita
https://qiita.com/cigalecigales/items/b81e95065982acb8aede

少し古い記事ですが、とても分かりやすいです。

 

さて、使い方です。
まずインストールですが、こちらのコマンドを実行します。

cordova plugin add cordova-plugin-camera

で、カメラを起動する場合は下記のように記述します。

// カメラを起動
navigator.camera.getPicture(
    cameraSuccess, 
    cameraError, 
    {
        quality: 100,  // 写真のクオリティ(0~100)
        destinationType: Camera.DestinationType.DATA_URL,  // 戻り値のフォーマット
        sourceType: Camera.PictureSourceType.CAMERA  // カメラで撮影
    }
);

// 写真撮影 成功
function cameraSuccess(result){
    // 成功時の処理
    var img = document.getElementById("image");
    img.src = "data:image/jpeg;base64," + result;
}
// 写真撮影 失敗
function cameraError(error){
    // エラー時の処理
}

カメラを起動する場合は、navigator.camera.getPicture() を実行します。
そして関数の第一引数では実行成功時に実行する関数を、第二引数では実行失敗時に実行する関数を指定します。
第三関数では関数のオプションを設定します。
今回は、写真のクオリティ・戻り値のフォーマット・ソースタイプを指定しています。
ソースタイプは、今回は Camera.PictureSourceType.CAMERA をしており、こちらは端末のカメラを起動しています。
なお、写真のライブラリを起動する場合は Camera.PictureSourceType.PHOTOLIBRARY で、アルバムを起動する場合は Camera.PictureSourceType.SAVEDPHOTOALBUM を指定します。
…写真ライブラリとアルバムはどう違うのか…今後検証したいと思います。

オプションはほかにもあり、外側 or 内側のカメラのどちらを起動するかや、写真撮影後に端末に画像を保存するかどうかも指定できます。
このあたりは、上で挙げた GitHub のページか Qiita の記事をご確認ください。

 

カメラプラグインの基本的な使い方は以上です。
が、個人的にはカメラ起動かギャラリー起動かを選べるとなおいいのですが…そういうプラグインは見つけられず…。
何かいい方法はないものか、現在模索中です。

  • この記事いいね! (0)

著者について

村上

村上 administrator