シアトルコンサルティング サービス開発ブログ

シアトルコンサルティング株式会社プロダクトソリューション事業部の開発ブログです

PhoneGap3でpluginを追加してみる(iOS)

satkakuです。

前回、PhoneGapを使ってのHelloWorldまでやりましたが、これだけだと、あまり意味がありません。デバイス情報とかカメラとかに触りたいところです。

PhoneGap3.0から、その辺のAPIはplugin化されたらしいので、自分で入れる必要があります。
この辺を見ながらやってみます。

% phonegap --version
3.1.0-0.15.0

さりげなく、PhoneGapも前回の3.0から、3.1にアップデートしてあります。

% phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git
[phonegap] adding the plugin: https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git
[phonegap] successfully added the plugin

まずは、簡単なところでDeviceプラグインを追加します。

% phonegap build ios  

phonegap buildして、Xcodeに移動してから、シミュレーターを起動させてみます。
すると、Build failedが出て怒られてしまいます。
(phonegap run iosだと、シミュレーターは起動しないのですが、特にエラーも出ませんでした……)

内容としては

clang: error: no such file or directory: アプリのルート/platforms/ios/アプリ名/Plugins/org.apache.cordova.device/CDVDevice.m

なんか無いらしいです。よしなにしてくれないのか、という思いはありつつ、とりあえず上記の場所に、アプリのルート/plugins/org.apache.cordova.device/src/ios/の下にあるCDVDevice.hとCDVDevice.mをコピー。

もう一回、Xcodeでシミュレーターを起動させると、今度はBuildは成功。

では使ってみましょうということで、window.alert(device.version) を書いて動かしてみます。

すると、今度は上の行の実行時に、Xcodeのコンソールにエラーが出ます。

ERROR: Plugin 'Device' not found, or is not a CDVPlugin. Check your plugin mapping in config.xml.

また、よしなにやってくれないのかよ! と思いつつ、config.xmlに追記します。
ちなみに、アプリのルート/www/config.xmlではなく、アプリのルート/platforms/ios/アプリ名/config.xmlのほうです。

<feature name="Device">
    <param name="ios-package" value="CDVDevice" />
</feature>

上記追記後、実行すると、ようやくデバイスのバージョン情報がalertされました。


=========


まとめると下記のような形となります。

(1) phonegap local plugin addでプラグイン入れる
(2) アプリのルート/platforms/ios/アプリ名/Plugins/に、アプリのルート/plugins/プラグイン名/src/ios/直下にあるソースファイルをコピー
(3) アプリのルート/platforms/ios/アプリ名/config.xmlにプラグイン情報を追記

めんどくさい!

なんか嘘臭い気もするので、もっといい方法があればまたブログ書きます。
3.0系はまだあんま情報が無くて辛いですね……。