以前、Dreamweaver CS5.5 + PhoneGapを用いたiPhoneアプリの制作方法について取り上げましたが、CS6ではやり方が大きく変わっている様なので、調べてみました。
下の動画は、AdobeがYouTubeで公開しているデモ動画です。これを見様見真似で試してみます。
まずは、Dreamweaverで適当なサイトを開きます(もちろん新規作成でも可)。この辺の手順は5.5と変わらないので、説明は割愛します。
メニューから「サイト」->「PhoneGap Build サービス」->「PhoneGap Build サービス」の順に選択すると、図1の様な画面が表示されます。
図1: PhoneGap Build サービスのウィンドウ
今回から、ビルドにはphonegap.comのアカウントが必要なので、アカウントを持っていない場合は、ここで作成します。
フォームに必要事項を入力して送信すると確認メールが届くので、メール中の”Confirm my account”のリンクをクリックするとアカウントが作成されます。この時、”create a new application”というページに飛ばされますが、とりあえずこれは無視して閉じてかまいません。
アカウントを作成したら、図1のウィンドウに、phonegap.comのアカウント作成時に設定したメールアドレスとパスワードを入力して、「ログイン」ボタンをクリックします。
初回ビルド時は、図2の様なエラーになるので、「新規プロジェクトとして作成」を選択して「続行」ボタンをクリックするとビルドが開始されます(図3)。
図2: エラー画面
図3: ビルド画面
図3から分かる通り、iOSやandroidなど、5つのプラットフォームに対応している様です。ただし、iOSだけは予めここに書かれている作業をしておく必要がある様です(未調査)。
ビルドが完了したら、図3の画面上にある「QRコードの表示」ボタンをクリックすると、ビルドしたアプリのURLが記録されたQRコードが表示されます。このQRコードを実機から読み込むと、その端末にアプリがインストールされます。
ビルドしたアプリはphonegap.comのサーバ上に保存され、ここのページで管理出来ます。直感的に操作出来るはずなので、色々試してみる事をお勧めします。
ちなみに、phonegap.comには図4の様な料金がかかるので、注意が必要です(私もよく分かっていないので、詳細はphonegap.comで確認して下さい)。
図4: phonegap.comの料金
(その3に続く?)
当ブログは、以下のリンク集に登録しています。
※正確には「ランキング」サイトですが、SNSなどを利用した組織票が横行しており、
本来の機能を果たしていない様なので、あえて「リンク集」と呼んでいます。
