qooxdoo mobileのチュートリアルでつくったサンプルをPhoneGapでiOSアプリとして動かす
まえがき
iOSアプリをつくることになったんですが、同じものをAndroidでもつくる必要があるのでPhoneGapとかかなぁって話になってます。
あとはネイティブアプリっぽいUIを実現するためのライブラリどうしようってところで、同じチームのある人がqooxdooいいよって言っていて、彼が他に挙げていたJavaScript UIライブラリのまとめを実機3つ(Galaxy S2 Android 2.3とiPhone 4 iOS5とiPhone 4S iOS6)で試してみたのだけど、やはりqooxdooの動作が軽快でよさげだったのでひとまずqooxdooのチュートリアルをやってみました。
一応他に挙げられていたもので僕が実機で調べたものも残しておきます。 他にもsenchaをはじめ5、6個くらいあったのですが彼のコメントから実機で試すまでもなさそうな感じだったので調べていません。
- w2ui
- Galaxy S2でdemoを見たら縦スクロールが発生するページで全て縦スクロールができなかった
- jQuery Mobile
- kendo UI
- Safariのステータスバー(一番上の時刻表示あたり)をtapすると一番上に戻るアニメーションが発生するけど戻らない…
事前にやっておくといいこと
qooxdooでつくったWebアプリをPhoneGapでiOSアプリとして動かすにはそれぞれのチュートリアルでできたファイルを一つのディレクトリに混ぜることになるので、それぞれのチュートリアルをやっておくといいです。
qooxdooのチュートリアル
チュートリアルで書いたコードはこれ
https://github.com/ozeppi/qooxdoo-Mobile-Twitter-Client-Tutorial
PhoneGapのチュートリアル
qooxdooチュートリアルで作ったサンプルをPhoneGapをつかってiPhoneアプリにする
http://manual.qooxdoo.org/current/pages/mobile/deployment.html
PhoneGapのディレクトリがassets/www/ではなくwww/なのを読み替えるくらい。
./generate.py buildするとbuild-iosってディレクトリができるのでそれをPhoneGapのディレクトリのwww/に上書き。
qooxdooのチュートリアルで書いたコードをPhonegapのprojectに混ぜるとこうなる。
https://github.com/ozeppi/sample-qooxdoo-mobile-and-PhoneGap
参考
http://demo.qooxdoo.org/current/playground/#Hello%20World-mobile