うさがにっき

読書感想文とプログラムのこと書いてきます

プラグインを使った、ネイティブ機能の利用

概要

CordovaからAndroidのネイティブ機能を利用する

詳細

ネイティブ機能(カメラとか位置情報など)にアクセスするにはプラグインを導入する必要がある

カメラプラグイン導入

$ cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
Fetching plugin "https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git" via git clone
Installing "org.apache.cordova.camera" for android
Installing "org.apache.cordova.camera" for ios


カメラプラグインを使ってみる
アプリ起動時にはwww/js/index.jsが開かれる
www/js/index.js

onDeviceReady: function() {
    app.receivedEvent('deviceready');

    // カメラのオプション
    var options = {
        quality: 50,
        destinationType: navigator.camera.DestinationType.FILE_URI
    };

    // カメラを起動
    navigator.camera.getPicture(function(imageData) {
        alert(imageData);
    }, function() {
        alert('fail');
    }, options)
},

f:id:tiro105:20140611155124p:plain

起動できた
補足だがネイティブの機能が準備されたことを発火する、onDeviceReadyイベントは以下の二つのイベントの後に発火される
DOMContentLoaded…HTMLのDOM要素が読み込まれたとき
load…ページのすべてのリソースが読み込まれたとき
そのため、画像などが多いページなどだとカメラの準備が遅くなることがありえる
画面の描画とは非同期に描画するなどを考えると吉

一応プラグインが入っているか確認

$ cordova plugin ls
org.apache.cordova.camera 0.3.1-dev "Camera"


これで各platform下にネイティブ機能を使う必要な設定やコードが配置されている
例えばAndroid

$ pwd
cordova/hello/platforms/android/src/org/apache/cordova/camera
$ ls -l
total 112
-rw-r--r--  1 staff  staff  39654  6 11 12:11 CameraLauncher.java
-rw-r--r--  1 staff  staff   7418  6 11 12:11 ExifHelper.java
-rw-r--r--  1 staff  staff   6197  6 11 12:11 FileHelper.java