CordovaでAndroidアプリを作ろうとする話

　Cordovaだよ。HTML5でAndroidからiOSからwindowsアプリとかクロスプラットフォームでアプリ開発出来るすごいやつらしいよ。今日はAndroidアプリを作ろうとしたよ。
とりあえずこのチュートリアルを進めたんだよ。
Apache Cordova Tutorial

0.環境導入

　ググって適当にやったら何かうまくいかなくてもう一回やったら何か上手く行った。大丈夫ググれば何とかなるから頑張れ。

1.プロジェクトの作成

　iOSへの対応は持ってないし環境整えるのも面倒だから今回は飛ばした。プラグインを導入するところで早速つまずく。

cordova plugin add org.apache.cordova.device
cordova plugin add org.apache.cordova.console

どうやらこのチュートリアル古いらしい。正しくはこう。

cordova plugin add cordova-plugin-device
cordova plugin add cordova-plugin-console

https://www.npmjs.com/package/cordova-plugin-device
Cordovaでは利用する各種機能がプラグインという形で提供されていてrubyのgemやpythonのpipのように適宜必要な物を付けたり外したりしていくらしい。

2.ビルド

動いた。

3.セットアップ

落としてきたものをそのままぶち込んで動かしてみる。何か動く。

4.データの扱い

　サンプルのindex.html内で参照するjsを切り替えることで情報を色んな方法で持ってくることが出来るらしい。デフォルトのmemoryだと普通にjsの変数に叩き込むだけだが、WebSQLにぶち込んでそこから取ってくることも出来るし、外部からjsonを引っ張ってくる事もできる。このサンプルでは3で落としてきたファイルの中にあるサーバーを自前で動かしそこから取ってくるようになってる。
　裏側の動きが変わるだけで表向きには変わらない。実際の運用ではデータの大きさとか更新頻度とかで適切なものを使い分けることになるだろう。

5.ダイアログを出してみる

　javascriptでもダイアログは出せるが、webブラウザのダイアログとスマホのOSの通知は別物だったりするわけで。その通知を出す機能が1でインストールしたようなプラグインの1つとして提供されている。そして1のように書かれているコマンドが古いので要注意。

cordova plugin add cordova-plugin-dialogs

チュートリアルに書かれている通りに、cordova.jsを読み込み(さっきインストールしたプラグインを有効にするため)、app.jsで馴染み深いwindow.alert()をcordovaのnotificationに上書きする。
そうするとこれがこうなる。

僕の環境だとダイアログの色が変わっただけだな……。

とりあえず今回はこんな感じ。
ちょっと古いけど日本語での解説が読みたかったらこっち読んだ方が多分早い。
Cordova(コルドバ)チュートリアル1 Cordovaプロジェクトの作成 - Symfoware