メモったものを投下しておきますね。
内容
- 前振り
- PhoneGap 2.2
- Phonegap2.2がリリース
- Phonegap Buildも2.0に対応
- 今まで1.9対応
- Phonegap 2.X, 2.2で変わった事
- プロジェクトの作成がコマンド一発で出来るようになった
- 今までは色々とやることがあって手順が大変だった
- インストール
- ダウンロードして、解凍すれば良くなった
- 解凍すると各OS環境ごとのビルド環境が出来上がります。サンプル付き
- プロジェクト作成
- デバッグについて
- iOS
- 実機の設定、Safariの一番下の詳細を表示し、WebインスペクタをONにする
- Objective-Cの部分も変えることが出来ます。表示領域を変えてみたりとか。iPhone用と、iPad用でディレクトリを分けたりとか出来ます。
- XcodeのRunで実機にインストールします。
- console.logは、XcodeのAll Outputに出るようになります。
- Xcodeでデバッグするときは、All Outputを見ればいいです。でも、コンソールデバッグしか出来ません。
- MacのSafariを立ち上げます。
- 環境設定の詳細で、メニューバーに開発メニューを表示を選択します
- 開発のメニューの中で、接続した実機が表示されます。そのなかで、表示中のhtmlファイルを選択します
- 普通にDevelopter Toolの開発機能が使えます。スタイルシートなども利用できます。
- ただし、Xcode4.5以上でなければ使えません。
- weinre
- Patrick Mueller @ Apache: weinre stuff
- node.jsが必要です。
- npmコマンドで必要なものをインストールします。
- npm install weinre
- ./node_modules/weinre/weinre で実行
- localhostの8080ポートでアクセスするとコンソールみたいなものが出てきます。
- localhost:8080/target/target-script-min.js#hogehoge のJavaScriptをscriptタグで入れる
- 通信するので、ExternalHostsにlocalHostを指定する。ホワイトリストに登録する。忘れがちなので、注意しましょう。
- シミュレータを起動します。(実機でもいいけど、同じWifi内に居ないとダメです。)
- Androidも一緒です。しかしながら、Androidでは、localhostにアクセス出来ないので、IPを指定してください。
- 実行の引数を変更する --boundHost=192.168.x.xのオプションを指定する
- iOS
- 開発
- 基本的には、APIリファレンスを見ながら練習します。
- 実際にドキュメントにあるコードがどのように動作するかわからないが、確認するためのアプリがある
- GWT Mobile Phonegap
- 実際にどう動くのかがわかります。DOCを押せば、ドキュメントが見れます。
- gwtmobile-phonegap - A GWT wrapper of the PhoneGap Javascript library. - Google Project Hosting
- iTunes Store へ接続中です。
- Githubに色々とプラグインがあります。
- phonegap/phonegap-plugins · GitHub
- Facebookとか、KeyChainとか、Paypalとか。
- 参考 → Android版PhoneGapプラグインの紹介 | Developers.IO
- プラグインを自作する
- jQueryMobile
- jQueryMobileの動作を確認するためのアプリもある
- jQueryが重いので、iPhone5以降のスペックであれば問題なく動作する
- 軽いライブラリが良ければ、Zeptoの方が良い
- Zepto.js: the aerogel-weight jQuery-compatible JavaScript library
- 基本はjQueryMobileと同じですが、Mobile特化なので軽くなっている
- パフォーマンスを気にするのであれば、色々なライブラリを試してみる必要がある
- コンテンツの作り込み
- PhoneGapの使い方よりも、コンテンツをどう作るのかが大事
- そういう勉強会もしたいですね。
- PhoneGapの使い方よりも、コンテンツをどう作るのかが大事
- JavaScript関係のお話
- プラットフォームの判別。
- 何故判断するのか?
- 端末による差を吸収するために、JavaScriptで分岐をしたり、そもそも読み込むJavaScriptファイル分ける必要がある場合がある
- deviceready
- DOMが構築される前にdevicereadyイベントが発生する可能性がある
- DOMContentLoadedイベントで、devicereadyのハンドリングした方が良いこともある
- document.addEventListener('DOMContentLoaded', function() {app.initialize()}, false);
- jQueryMobileを利用している場合だと、ベージの初期化が終わった後のイベント(pageinit)などで行うとよい
- その他
- Androidはクリックイベントが遅い。
- jQueryMobileでは、vclickを使うほうがよい
- 参考 → jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
- Androidはクリックイベントが遅い。
- 次回勉強会
- 年明けに予定しています
Android/iPhone/Windows Phone対応 jQuery Mobileスマートフォンアプリ開発
- 作者: 岡本隆史,梶原直人,田中智文
- 出版社/メーカー: ソフトバンククリエイティブ
- 発売日: 2012/06/20
- メディア: 大型本
- 購入: 1人 クリック: 62回
- この商品を含むブログ (5件) を見る