jquery mobile で作る" 実用" スマフォアプリ
DESCRIPTION
オープンソースカンファレンス2012 Tokyo Fall jQuery Mobile で作る" 実用" スマフォアプリTRANSCRIPT
オープンソースカンファレンスオープンソースカンファレンス 2012 2012 Tokyo FallTokyo Fall
jQuery Mobile で作る " 実用 " スマフォアプリ
2012/9/8梶原 直人
カスタマイズ
● jQuery Mobile は、スマフォ用に UI をリッチにしたり、イベント処理を補助するだけ・・・
● jQuery Mobile をベースに、もっと色々なことがしたい
● HTML5 の API 、 jQuery Plugin 、その他各種ライブラリを組み合わせて、「実用的なスマフォアプリ」が作れる!
● いくつかの例をご紹介
jQuery Mobile +jQuery Validation(jQuery Plugin)● 入力チェック● HTML5 のフォームバリ
デーションでは OS やブラウザの違いがある
● jQuery Validation はクロスプラットフォーム対応
jQuery Mobile +jqPlot(jQuery Plugin)● 多彩なグラフ表示● jQuery Mobile にも対
応、スマフォ特有のタッチイベントをキャッチ
jQuery Mobile +加速度センサー API(HTML5)● 旗取りゲーム● スマフォを傾けてボール
を操作できる● HTML5 の API を活用
● ondevicemotion イベント● accelerationIncludingGra
vity
jQuery Mobile +Canvas(HTML5)● お絵かきアプリ● jQuery Mobile が提
供する touch イベントと Canvas 要素の組み合わせ
jQuery Mobile +SNS● Twitter や FaceBook
のライブラリ、 API との組み合わせ
● ツイートのリスト化も簡単
jQuery Mobile +PhotoSwipe● サーバに保存した画像を
スライドショー表示● PhoteSwipe は MIT ラ
イセンスの OSS● PhotoSwipe 側が
jQuery Mobile に対応している
jQuery Mobile +Geolocation API(HTML5) + Google Maps API
● 移動距離測定+マップ表示アプリ● HTML5 の位置取得 API と Google Maps API
の組み合わせ● 移動した距離は WebStorage により履歴とし
て保管● 詳しくはデモで
実際使われてるの?● jQuery Mobile Gallery
http://www.jqmgallery.com/
120サイト以上登録されてます120サイト以上登録されてます
日本でも利用事例多数!!!
こんなものまで・・・ !!???
● Angry Nerds● http://www.jqmgallery.com/2011/04/01/angry-nerds/