#daiizメモ

Cosenseに夢中

Android で Chrome Apps を起動させた!!

連休中、前々から気になっていた MobileChromeApps (cordova chrome app)に挑戦しました。上記リンク先のGitHub上の英語の説明を解読しながら環境を構築し、Hello worldすることを目標に頑張りました。

結果

できました!!!*1

f:id:daiiz:20140506000118p:plain

環境構築を終えたあとにやったことは

  • コマンドプロンプトcca create YourAppを実行
    • これを実行するだけで、manifestファイル、htmlファイルをはじめ、アイコンやその他必要な設定ファイルを自動で生成してくれました!すごい!
  • Nexus7 を接続
    • Android端末を持っていない場合はcca emulate androidを実行
  • コマンドプロンプトcca run androidを実行

だけです。

予想以上に早くできました。手順説明が読みやすい英語で書かれていたおかげだと思います。

さらに

時間と体力が残っていたので、いろいろJavaScriptを書き実行してみながら、デスクトップ版の Chrome Apps との比較をしてみました。
勘違いや間違いを含んでいるかもしれません。

デスクトップ版 Chrome Apps Mobile Chrome Apps
パッケージ内の画像の表示 imgタグのsrcに相対パスを指定 imgタグのsrcに相対パスを指定
外部の画像の表示 imgタグのsrcにwebkitURL.createObjectURLで生成したBlobオブジェクトのURLを指定 ・imgタグのsrcにwebkitURL.createObjectURLで生成したBlobオブジェクトのURLを指定
・imgタグのsrcにパスを指定
aタグでパッケージ内のHTMLを新しいウィンドウで開く × ×
aタグで外部のURLを新しいウィンドウで開く target = '_blank' を指定するとブラウザが起動 target = '_blank' を指定するとブラウザが起動
パッケージ内のHTMLを新しいウィンドウで開く chrome.app.window.createのみ window.openのみ

感想

英語の読み間違えでなければ、このMobileChromeAppsツールチェーンはまだデベロッパープレビューの段階だそうです。しかし今日使った機能まわりは特に不具合等はなく、かなり完成度が高いと思いました。実際に使ってみると、今後がさらに楽しみになりました。それより何より、なんといっても、JavaScriptAndroidアプリを書けるということは素晴らしい!と思います。

*1:スクリーンショットは今撮りました。作業中に撮るのを忘れていました。。。