犬でもできる！　杏子とわんこのAIRNovel講座　第3回

Flex SDKの設定

ボタンは作業順に並んでいるから、上から順番にやっていけばきっと大丈夫だよ。まずは［Flex SDK設定］をクリックしてね。

［Flex SDK パス］というテキストボックスと、［Flex SDKをネットからダウンロード］というボタンがあるけど、Flex SDKってなんだワン？

Fles SDKの設定

.airファイルをビルドするのに必要なものなのよ。
「Flex SDK パス」に「C:\FlexSDK」ってキーボードで入力して、［Flex SDKをネットからダウンロード］ボタンをクリックしてね。

ダウンロードの進捗は表示されているけど……全部終わるまでちょっと時間がかかりそうだワン。

環境によって違うんだけど、数十分待つこともあるかな？　この作業をするときは少し気長に待ってね。ここではFlex SDKとAIR SDKをダウンロードしてるんだけど、ダウンロードしたファイルはさっき指定した「C:\FlexSDK」に置かれるよ。

ダウンロードが終わったみたいなので、エクスプローラで「C:\FlexSDK」を開いて見てみるワン。お、色々ファイルが出来てるワン。

AIRlibの設定

じゃあ次の作業に行ってみようか。
ビルド環境設定画面の上から2つ目のボタン、［AIRlib設定］をクリックして画面を開いて、Flex SDKのときと同じように進めてね。
「AIRlib パス」を入力するところでは「C:\AIRlib」って入力、その後［AIRlibをネットからダウンロード］ボタンを押すんだよ。

AIRLibの設定

JDKの設定

AIRlibも終わったので次行くワン！
ボタンの並び順通りなら、次は［JDK / Ant環境］だワンっと……
おや？　今度は2つの黒いボタンが出てきたけど、どっちを選べばいいのかワン？
あ、上から順にクリックしていくのだから、まず［JDKのインストール(ブラウザを開きます)］のほうかワン？

そうだよ。ここでは、JDK（Java Development Kit）とAntという環境を設定するの。ここ書いてある通りに進めればOKだよ。

JDK / Ant環境の設定

じゃあ順番に説明するね。
［JDKのインストール(ブラウザを開きます)］をクリックすると開くページから辿ってJDKをインストールするの。直接アクセスするなら以下のURLだよ。

Webページが開いたら、下に「Java Plaform(JDK)」と書いてある「DOWNLOAD」のリンクをクリックしてダウンロードページに移動してね。

Webブラウザーで開いたJDKのページで「Java Plaform(JDK)」の「DOWNLOAD」リンクをクリック

……ご主人、わんこ、アメリカ語は苦手だワン。Sorry, Japanese only.だワン。なにしろ日本犬だし。

アメリカ語？　まあ、じっくり手順を説明していくから大丈夫だよ。説明画面を見ながら一緒にやってみようね。

まずはライセンスを確認して、同意するなら［Accept License Agreement］をクリック。Windowsが32bitか64bitか、開発するPCによってどちらかをダウンロード＆インストールするの。
32bitなら「Windows x86」、64 bitなら「Windows x64」をそれぞれ選択するんだよ。

ライセンスを確認してダウンロード

インストーラーは日本語だから、わんこでも出来そうだワン。

インストーラーで表示される「インストールするオプション機能」は全部入れてね。
あと、インストールするオプション機能の選択画面に表示される、「開発ツール」の「インストール先」をきちんと控えておいてね。
インストール先のパスはバージョンによって少し変わっちゃうから、ここの画面のスクリーンショットを撮っておくといいよ。

JDKをインストール

パスが変わると何か問題があるのかワン？

JDKのインストールが終わったら、ユーザー環境変数を設定する必要があるの。「Path」と「JAVA_HOME」の2つなんだけど、ここに設定する文字列も変わるのよ。

環境変数って難しそうでよくわからないワン……。ここは間違えたら大変そうだし、操作手順を詳しく教えてほしいワン！

じゃあ、画面で説明するね。これはWindows Vistaの画面だけど、Windows 7でも基本的に同じだよ。
まずはエクスプローラを開いて［コンピュータ］をクリック。
続いてウインドウの上の方にある［システムのプロパティ］をクリックしてね。

エクスプローラの「コンピュータ」上で［システムのプロパティ］をクリック

コントロールパネルの「システム」設定画面が開いたら、［システムの詳細設定］をクリック。

［システムの詳細設定］をクリック

「システムのプロパティ」ウインドウの［詳細設定］タブを選択して、［環境変数］をクリック。

［環境変数］をクリック

「環境変数」のダイアログが開くから、ここで2つの環境変数を設定していくね。まずは「システム環境変数」の「Path」を選択し、［編集］をクリック。

環境変数「Path」を選択して［編集］をクリック

わんこのPCには「Path」がないワン！

環境変数「Path」が項目ごとない場合は［編集］ボタンの左横にある［新規］ボタンをクリックして、新たに「Path」を作ってね。それから、［変数値］テキストボックスを編集するんだけど、直接テキストを編集するんじゃなくて、テキストエディターに文字列をコピー＆ペーストしてから編集すると楽だよ。

「Path」環境変数の編集画面

編集内容だけど、今ある文字列の末尾に「;」＋「インストール先」＋「\bin」って文字列をつなげるの。元々テキストボックスの中が空っぽなら「;」はいらないけどね。編集例はこんな感じだよ。

つまり、元々文字列があったら、一番最後に半角セミコロンを入れて、その後ろに
C:\Program Files\Java\jdk1.7.0_21\bin
って書く。
JDKのバージョンが上がってJDKのインストール先のパスが変わったらそれに合わせた表記にする。
その時は間違えないように、保存しておいたJDKインストール先のスナップショットを確認しながら編集する……ってことかワン？

わんこちゃんよくできました☆
編集が終わったら［OK］ボタンを2回押して「システムのプロパティ」画面まで戻れば、環境変数「Path」にJDKのインストールパスが追加されるよ。

わんこ、うまく編集できたか自信がないワン。

じゃあ、コマンドプロンプトを開いて、「javac -version」って入力して、Enterキーを押してみて。

「javac 1.7.0_21」と出たワン。

コマンドプロンプトでJDKのバージョンを確認

ここでバージョン確認ができたら、うまく設定できたってことよ！

同じ感じで、続いて環境変数「JAVA_HOME」も追加するのかワン？

そうそう。環境変数「JAVA_HOME」はこれまで設定していなければ存在しないので、新規作成してね。
環境変数「JAVA_HOME」に設定する文字列は環境変数「Path」と同じで、今回の場合は「C:\Program Files\Java\jdk1.7.0_21\bin」だよ。
うまく設定できたかどうかを確認するときは、コマンドプロンプトで「set JAVA_HOME」って入力してEnterキーを押してね。

今入力したのがちゃんと表示されたワン！

コマンドプロンプトでJAVA_HOME環境変数の中身を確認

Antの設定

次はAntをインストールするよ。
ANBooksの環境設定画面の中の、［Antのインストール（ブラウザを開きます）］ボタンをクリックすると開くページから辿ってダウンロードするの。直接ダウンロードページを表示するなら以下のURLだよ。

ページを開いたら、左メニューの［Binary Distributions］をクリックしてね。

［Binary Distributions］をクリックする

「Current Release of Ant」の中にZIPファイルへのリンクがあるから、クリックするとファイルをダウンロードできるよ。ダウンロードが終わったら解凍してね。

ZIPファイルへのリンクをクリックしてダウンロード

解凍したファイルはフォルダごと、「C:\Program Files」の下にコピーしてね。ここもバージョンによってパスが変わるけど、今回はこうなったよ。
C:\Program Files\apache-ant-1.9.0
繰り返して言うけど、数字はバージョンによって変わるから、バージョンアップしていたら読み替えてね。

「apache-ant-1.9.1」「apache-ant-1.9.2」って感じで変わっていくのかワン？

たぶんそんな感じだろうね～☆
JDKと同じようにAntも環境変数を設定するよ。まずは環境変数「Path」に「%ANT_HOME%\bin」を追加。あとは環境変数「ANT_HOME」を新規作成して、「C:\Program Files\apache-ant-1.9.0」を入力してね。

これも設定できたかどうかをMS-DOS画面で確認できるのかワン？

今はMS-DOSとは言わないよ、「コマンドプロンプト」だよわんこちゃん。
またコマンドプロンプトを起動して……あ、前に開いたのが開いたままならいったん閉じて開き直してね。
今度は「ant -version」と入力してEnterキーを押したときに、バージョンが表示されればOKだよ！

コマンドプロンプトでAntのバージョンを確認

インストーラーの作成

なるほど、これは大変だワン……。初心者がつまづく理由もよくわかるワン。
でも設定箇所をきちんとお手本通りに設定すればわんこだってなんとかなったワン。
これからゲームを作りたいと思っている人の役に立ったかもしれないワン。

きっとお役に立ったと思うよ♪
じゃあ、わんこちゃん、いよいよビルドをするよ。ここまでがちゃんと出来ていればあとは簡単だよ！

わんこ、いつ何時、どんな挑戦でも受けるワン！

ANBooksでわんこちゃんが作ったゲームのプロジェクトの詳細画面を開いてくれる？　そしたら［ツール］ボタンをクリックしてサブメニューを開いて、［フォルダ絶対パスをクリップボードへ］ボタンをクリックしてね。

プロジェクトのフォルダパスをクリップボードへコピー

クリックしたワン。

そしたらコマンドプロンプトを起動して、半角で「cd」とスペースを入力して、右クリックメニューからコピーしたパスを［貼り付け］して、Enterキーを押してくれる？

押したワン。

そしたら「ant」と入力して、Enterキーを押して？

カレントパスの移動とAntの実行

むむ、なんだか横文字がいっぱい出てきたワン！　……あ！　わんこのゲームが起動したワン！

おめでとう！　それが「ビルドによる起動」だよ。じゃあ、今度は.airのインストーラーを作ろうか。
起動したゲームをいったん閉じたら、今度はコマンドプロンプトに「ant air」って入力してEnterキーを押して！

肉球タイピングッ!!　……む、「BUILD SUCCESSFUL」って表示されたワン!?

.airインストーラーを生成

「ビルドに成功しましたよ」って意味だよ☆　つまり.air形式のファイルが出来たってこと！　試しにプロジェクトフォルダにある、拡張子が.airのファイルを開いてみて。

「アプリケーションのインストール」が始まったワン！　ANBooksをインストールしたときもこんな感じのを見た覚えがあるワン！

インストールダイアログ

インストールが完了したら、スタートメニューからゲームを起動して遊ぶことができるようになるよ！

設定が大変だったけど、ちゃんとしたゲームになってよかったワン！

自己署名ファイルの作成

最後に、作ったゲームを一般に配布する場合は、自分で作った「自己署名ファイル」を用意してほしいの。もう一息で完成だから、あと少しだけだけがんばってね、わんこちゃん？

「自己署名ファイル」というのは必ず必要なのかワン？

ANBooksが標準でダミーの「自己署名ファイル」を用意しているから、ないと絶対に動かないというものではないよ。でも、これだとANBooksを使っている人みんなで同じ設定だから、ファイルの改ざんされていないことを保証できないの。

なるほど……それは困るワン。もう少しがんばるワン。

まずはANBooksのビルド環境設定画面の［自己署名設定(.air、.apk作成に必要）］ボタンを押して、［自己署名ファイル］の欄にあるパスの末尾のファイル名だけを「dummy_store.p12」から任意のファイル名に書き換えてね。同じように［自己署名パスワード］も「dummy_password」から任意の英数字に変更するんだよ。

自己署名ファイルのファイル名やパスワードを自分用に書き換え

ファイル名やパスワードは何でもいいのかワン？

基本的に英数字がいいね。あと、パスワードは他人に知られないものにしてね？
書き換え終わったら、入力欄の下にある［自己署名ファイルの作成方法］ボタンを押してね。そうしたら［現在の環境を反映してクリップボードへコピー］ボタンがあるから、これを押して、コマンドプロンプトに貼り付けて実行してね。コマンドはこんな感じになるはずだよ。

"C:/FlexSDK/bin/adt" -certificate -cn SelfSigned -validityPeriod 20 1024-RSA "C:/Users/(ユーザー名)/AppData/Roaming/com.fc2.blog38.famibee.ANBooks/Local Store/(設定したファイル名).p12" (設定したパスワード)

自己署名ファイル生成用のコマンドをクリップボードにコピー

コマンドプロンプトに貼り付けて自己署名ファイルを生成

自己署名ファイルが生成された

これであらためてインストーラーを生成すれば、今度こそ完成だワン？

うん、これでいよいよ、どこに出しても恥ずかしくないインストーラーの完成だよ☆
第1回で言ったけど、サンプルゲームをテンプレートにした場合は、公開前にサンプルゲームの立ち絵・背景・BGM・効果音がプロジェクトのフォルダに残っていないか気を付けてね。