20120914 phone gap勉強会_青山
DESCRIPTION
PhoneGap UserGroup PhoneGap勉強会 発表資料TRANSCRIPT
PhoneGap-UserGroup 第 2 回勉強会 @ 大阪
PhoneGap の始め方〜 PhoneGap Build で作るモバイル・アプリケーション 〜
株式会社 蒼画堂青山政勝
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
自己紹介 青山政勝
株式会社蒼画堂 ( そうかくどう ) 代表 歯科診療に関する業務アプリ開発
歯科系大学の研究を支援するアプリ開発
FxUG でのハンドルネーム :bluedesign
スマートフォン / タブレットベースのアプリ開発
に対応するために勉強中。
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
Contents
まずは始めてみましょう▶テキストエディタ + PhoneGap Build
今回は Adobe brackets を使用します
▶Dreamweaver CS6 + PhoneGap Build
PhoneGap Build の使用感
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
まずは始めてみましょう
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
Adobe brackets + PhoneGap Build
1. Adobe brackets( https://github.com/adobe/brackets ) を使っ
て index.html ファイルを作ります。
2. PhoneGap Build サイト ( https://build.phonegap.com ) にロ
グインして新規にアプリケーションを作成します。 index.html
ファイルをアップロードします。
3. モジュールがビルドされるので完了したら Android スマート
フォンにダウンロード、インストールして動かします。
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
index.html の内容
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
<!DOCTYPE html><html> <head> <title>Hello PhoneGap</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> <meta charset="utf-8">
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript">
function onBodyLoad() { document.addEventListener("deviceready", onDeviceReady, false); }
function onDeviceReady() { // do your thing! navigator.notification.alert("PhoneGap is working") }
</script> </head> <body onload="onBodyLoad()"> <h1>Hey, it's PhoneGap!</h1> </body></html>
Dreamweaver CS6 + PhoneGap Build
ADC のサイト (
http://www.adobe.com/jp/devnet/phonegap/articles/phoneg
ap_dwcs6_mobile_app.html
) を参照。
記事作成時 (2012 年 7 月末 ) からの変更点は、、、 PhoneGap Build サイト UI の変更により、プラットフォーム毎にあった QR
コードが、アプリに毎に 1 つの QR コードとなった。
対象とする PhoneGap のバージョンに phonegap 2.0.0 が選択できるように
なった。
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
PhoneGap Build の使用感
開発環境のセットアップが容易。▶ まずは自分のスマートフォンでHelloWorldを表示 !というところまでが短時間で実現できる。
▶ 実装したい内容が PhoneGap Buildを利用して実現できるかどうかの検証ができる。
ソースを更新したときにその都度アップロードする必要がある。テキストエディタ +PhoneGap Buildの場合が面倒。 (複数のファイルで構成されるプロジェクトのときはその都度圧縮が必要 ?) Dw CS6+PhoneGap Buildの場合はアップロードを意識しなくてよい。
こみ入った実装を考えるとすぐに壁 ?にぶつかる。▶ 例 )カメラ機能のシャッターイベントをプログラムでコントロールしたいと思っても手段がなさそう。
▶ PhoneGap Plugins機能が解決してくれそうだが現在 PhoneGap Buildのインフラを整備中とのこと (2012年 09月時点 )。
https://build.phonegap.com/docs/plugins
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
Next Step….
ちょっとアプリ機能を利用したい。▶どこまでできるか見極めつつ PhoneGap Buildで。
PhoneGap APIだけでなくもうちょっと踏み込んだ本格的なアプリが作りたい。▶Xcodeや eclipseを使った PhoneGap開発環境でのアプリ開発へ。
Apr 12, 2023 ⓒSOHKAKUDO Ltd.
ご清聴ありがとうございました
Apr 12, 2023 ⓒSOHKAKUDO Ltd.