カメラ・アルバムにアクセスするためのプラグイン
続いて、カメラとアルバムにアクセスするためのプラグインを紹介します。
インストール方法
インストールするプラグインは、「cordova-plugin-camera」です。インストールはリスト4のように行います。
$cordova plugin add cordova-plugin-camera
プラグインの動作概要
このプラグインは図1のようにカメラもしくはアルバムからデータ取得要求をするとそれぞれ、別のアプリもしくは画面が起動します。
従って、起動された新しい画面での操作についてはCordova側からは制御ができません。それぞれの画面上で操作が完了し、カメラであれば撮られた写真もしくはビデオ、アルバムであれば選択された写真もしくはビデオファイルがCordova側のJavaScriptに戻されるという動作の流れになります。既存のファイルをJavaScript側からユーザーの操作なしに取得することはできません。このような処理の流れはHTMLでいうINPUT(type=file)要素での制限に似ているので、そのような利用シーンを想定するとわかりやすいと思います。
プラグインの使い方
このプラグインは先ほど紹介したようにカメラを要求する場合と写真アルバムへのアクセスを要求する必要がありますが、どちらの場合でもリスト5のgetPictureメソッドを使います。
そして、それらの動作や各種設定をまとめてパラメータとして指定します。
navigator.camera.getPicture(successCallback, errorCallback, options)
表3で示すパラメータが指定できます。
| パラメータ名 | 説明 |
|---|---|
| codesuccessCallback | 取得に成功した時に呼ばれるコールバック関数。引数にはファイル名もしくはデータ(base64)が設定 |
| errorCallback | エラー時に呼ばれるコードバック関数。エラー時にはエラーメッセージが設定 |
| options | 動作の指定、制限などをパラメータで指定 |
optionsで指定できるプロパティは表4のとおりです。多少設定できるパラメータが多くなっています。
| パラメータ名 | 型 | 説明 |
|---|---|---|
| sourceType | Camera.PictureSourceType | 画像・映像の取得元を設定 |
| destinationType | Camera.DestinationType | successCallbackで取得するデータ形式を指定 |
| quality | number | 保存する画像のクオリティを0-100で指定 |
| allowEdit | Boolean | 画像を取得する際にオリジナルファイルから指定した他のプロパティに応じた編集後のファイル・データを取得。Androidの場合、内部でtrueの時はIntent.ACTION_PICK、falseの場合にはIntent.ACTION_GET_CONTENTのIntentでアプリが起動される。また、iOSでは、UIImagePickerControllerが呼ばれる場合にallowsEditingの指定がされる。表5は、カメラを起動するのか、もしくはアルバムなどのギャラリーからファイルを選択するのかを指定する定数 |
| encodingType | Camera.EncodingType | 取得する画像のエンコーディングをJPEGもしくはPNGから選択 |
| targetWidth | number | 画像を取得する際の横サイズの指定(縦サイズも指定する必要あり) |
| targetHeight | number | 画像を取得する際の縦サイズの指定(横サイズも指定する必要あり) |
| mediaType | Camera.MediaType | 選択する際、写真か映像、もしくはその両方を指定。sourceTypeでカメラ以外を選択したときのみ有効 |
| correctOrientation | Boolean | 写真の向きを調整して画像を取得 |
| saveToPhotoAlbum | Boolean | 取得した画像をアルバムにも保存 |
| cameraDirection | Camera.Direction | カメラが起動したときにデフォルトで前後どちらのカメラを使用するかを設定(AndoridはBACKのみ) |
| popoverOptions | Camera.CameraPopoverOptions | 選択する写真のプレビューなど、ポップオーバーの位置や矢印の向きを指定するためのパラメータ(iPadのみ)。詳しくはこちらを参照 |
sourceTypeプロパティで指定できる定数は、表5のとおりです。
| 変数名 | 説明 |
|---|---|
| PHOTOLIBRARY | アルバムから写真・画像を選択 |
| CAMERA | カメラを起動して写真、もしくはビデオデータを取得 |
| SAVEDPHOTOALBUM | カメラロールから画像・ビデオを選択。Androidの場合には、PHOTOLIBRARYと同じ |
destinationTypeプロパティで指定できる定数は、表6のとおりです。
| 変数名 | 説明 |
|---|---|
| DATA_URL | Base64でエンコードされた文字列形式でデータを取得 |
| FILE_URI | 「file://」形式もしくは、「content://(Androidのみ)」形式でデータのパスを取得 |
| NATIVE_URI | iOSの場合には、「asset-library://」形式でパスを取得。Andoirdの場合はFILE_URIと同じ |
encodingTypeプロパティで指定できる定数は、表7のとおりです。
| 変数名 | 説明 |
|---|---|
| JPEG | JPEG形式でデータを取得 |
| PNG | PNG形式でデータを取得 |
mediaTypeプロパティで指定できる定数は、表8のとおりです。
| 変数名 | 説明 |
|---|---|
| PICTURE | 画像形式のデータのみの指定 |
| VIDEO | ビデオ形式のデータのみの指定 |
| ALLMEDIA | すべてのメディアタイプを指定 |
cameraDirectionプロパティで指定できる定数は、表9のとおりです。
| 変数名 | 説明 |
|---|---|
| BACK | 背面カメラをデフォルトに指定 |
| FRONT | 前面カメラをデフォルトに指定 |
また、iOSでgetPictureメソッドを使ってカメラで写真を撮り、FILE_URI形式でデータを取得する場合、テンポラリ領域にデータが残ってしまいます。そのため、リスト6のcleanupメソッドを使って後でデータをクリアする必要があります。
navigator.camera.cleanup(successCallback, errorCallback)
cleanupメソッドでは表10のように成功した場合のコールバック関数と失敗した場合のコールバック関数が指定できます。
| 変数名 | 説明 |
|---|---|
| successCallback | 処理に成功した時に呼ばれるコールバック関数 |
| errorCallback | エラー時に呼ばれるコードバック関数。エラー時にはエラーメッセージが設定される |
このcleanupメソッドはiOSでのみサポートされるため、Andorid端末から呼び出したときはエラーになりエラー用のコールバックが起動されます。内部では何も処理をしていないため特に悪影響はないと思われますが、iOS端末の場合でのみ起動するようにした方がよいでしょう。
