準備ができたら、何はともあれActionレイヤーの第2フレームを選択してFlashの再生を停止するスクリプトを書き込みましょう。第2フレームに以下のスクリプトを追加してください。
stop();
最後はセミコロンですので間違えないように。
これでデバッグなどでFlashを再生した際に第2フレームまで進んだところで再生が停止されます。
次にボタンにスクリプトを追加してボタン機能を有効にします。
最初は第2フレーム(room1)で右側のボタンをクリックしたら次の部屋(第3フレームのroom2)へ移動するというスクリプトを追加してみましょう。
先ほどstop();を記述したActionレイヤーの第2フレームを開いて、以下のように記述してください。
next_btn1.addEventListener(MouseEvent.CLICK,idou1);
function idou1(event:MouseEvent):void{
gotoAndStop("room2");
}
上記のスクリプトの内容は、
「next_btn1をクリックしたら、idou1という名前で作った、room2へ移動して停止するという処理を行います」
というものになっています。
1行目 next_btn1.addEventListener(MouseEvent.CLICK,idou1);
next_btn1は前回ボタンのムービークリップにつけた名前です。
addEventListener(MouseEvent.CLICK,idou1);はマウスをクリックしたら何か(今回はidou1)をする。という時に使う決まった書き方です。大文字小文字も間違わないようにしてください。idou1は次行のfunction idou1を表していて、このカッコ内に書いたidou1部分と、次行のidou1部分の名前はいつも同じでなければいけません。(カッコ内がidou2ならfunctionに続く部分もidou2となってなければいけません)
2行目 function idou1(event:MouseEvent):void{
function idou1のidou1部分はこれから作る処理内容全体につけた名前(関数名)です。前行のカッコ内でidou1の部分で付けたのと同じ名前になっています。その次にある(event:MouseEvent)は最初のeventは半角英数以上の決まりはないので、ここがabcでもeだけでも問題ありませんが、普通はeventかeを付ける場合が多いと思います。このブログ内ではeventを使います。コロンで区切って、MouseEventの部分は1行目のカッコ内がMouseEvent.CLICKの場合の決まった書き方です。
さらにコロンで区切ってvoidの部分ですが、ここは戻り値を設定しています。が今回の脱出ゲーム作りではここは全部voidになるので、とりあえずは決まった書き方と思っておいてください。
3行目 gotoAndStop("room2");
{}で挟まれたgotoAndStop();はカッコ内で指定したフレームに移動して停止するという意味を持っています。カッコ内はフレーム番号を半角数字(1,2,3...)かラベル名が使用できます。ラベル名の場合、ラベル名を""で囲って使うようにしてください。"room2"部分は移動先をラベル名で指定しています。なので""で囲っています。
以上をまとめると、
ムービークリップをクリックしたら処理内容を実行する場合の書き方
ムービークリップ名.addEventListener(MouseEvent.CLICK,関数名);
function 関数名(event:MouseEvent):void{
処理内容
}
となっていることが分かると思います。多分脱出ゲームでは一番多用することになります。ActionScript2.0での書き方とくらべるとややこしいですがガマンしてください。
それでは全てのボタンにこのやり方で、ボタンを押した時の移動先を設定していきます。言い忘れましたが、ここでのやりかたは基本的に「脱出ゲーム」の作り方でのやりかたをActionScript3.0に書き換えるというものなので、基本力業です。効率よりも単純さを重視しています。なので、もっと簡単な方法があるのにと思われるかもしれませんが、そういう人は自力でがんばってください。
●アクションレイヤー
第2フレーム
stop();
next_btn1.addEventListener(MouseEvent.CLICK,idou1);
function idou1(event:MouseEvent):void{
gotoAndStop("room2");
}
prev_btn1.addEventListener(MouseEvent.CLICK,idou2);
function idou2(event:MouseEvent):void{
gotoAndStop("room4");
}
●第3フレーム
next_btn2.addEventListener(MouseEvent.CLICK,idou3);
function idou3(event:MouseEvent):void{
gotoAndStop("room3");
}
prev_btn2.addEventListener(MouseEvent.CLICK,idou4);
function idou4(event:MouseEvent):void{
gotoAndStop("room1");
}
●第4フレーム
next_btn3.addEventListener(MouseEvent.CLICK,idou5);
function idou5(event:MouseEvent):void{
gotoAndStop("room4");
}
prev_btn3.addEventListener(MouseEvent.CLICK,idou6);
function idou6(event:MouseEvent):void{
gotoAndStop("room2");
}
●第5フレーム
next_btn4.addEventListener(MouseEvent.CLICK,idou7);
function idou7(event:MouseEvent):void{
gotoAndStop("room1");
}
prev_btn4.addEventListener(MouseEvent.CLICK,idou8);
function idou8(event:MouseEvent):void{
gotoAndStop("room3");
}
ボタンのムービークリップ名、関数名がかぶるとエラーが吐かれるので(1021 関数の定義が重複しています)気を付けましょう。
ボタンを押したら移動できるようになりました。
前回までの準備編は後々書き直したくなりそうなので、読まなくても良いように書いていこうと思います・・・。いきあたりばったりはこれだから困る。
なので今回は内容が前回と重複してます。
部屋移動完成予想図
まず最初は室内の移動を実現させましょう。
今回作成するFlashのフレームの構成は以下のようになっています。

画像も文字も入ってない白いフレームは「空のフレーム」です。
「Action」レイヤーにあるαはスクリプトが書かれていることを示しています。
「ラベル」レイヤーの各フレームに書かれている「room1」~「room4」はそのフレームのラベル名を示しています。
脱出ゲームに限らずFlashでゲームを作る際は第1フレームは空けておくと良いようです。このフレームは初期化と呼ばれる、ゲーム開始時のゲームの状態(点数は0点とか)を設定するスクリプトを書くための場所として使います。(背景が入ってしまってますが気にしないでください)
■最初に画像を設定していきます。
室内レイヤー:全てをキーフレームに変換して、各フレームに画像を挿入してください。種類はなんでもよいです。
背景レイヤー:最初のフレームから最後のフレームまで繋がった一つのフレームです。これも画像はなんでもよいです。
ボタンレイヤー:全てをキーフレームに変換して、各フレームに画像を挿入してください。室内の移動に使うボタンの画像を挿入します。ボタンの画像はムービークリップに設定してください。
ムービークリップには、名前を設定できます。
第2フレームに配置したボタンの名前を、
左側のボタン:prev_btn1
右側のボタン:next_btn1

と設定してください。以下同様にして、
第3フレーム
左側のボタン:prev_btn2
右側のボタン:next_btn2
第4フレーム
左側のボタン:prev_btn3
右側のボタン:next_btn3
第五フレーム
左側のボタン:prev_btn4
右側のボタン:next_btn4
と設定します。
次にラベルレイヤーを用意して、第2フレームにラベル名「room1」を設定します。
以下、第3フレームから第5フレームに、それぞれ「room2」~「room4」と設定していきます。
以上で必要な準備は終了しました。再生すると室内画像が何周もループするファイルが作成されます。
後はActionレイヤーにアクションスクリプトを書くだけです。が、疲れたのでまた明日。
なので今回は内容が前回と重複してます。
部屋移動完成予想図
まず最初は室内の移動を実現させましょう。
今回作成するFlashのフレームの構成は以下のようになっています。
画像も文字も入ってない白いフレームは「空のフレーム」です。
「Action」レイヤーにあるαはスクリプトが書かれていることを示しています。
「ラベル」レイヤーの各フレームに書かれている「room1」~「room4」はそのフレームのラベル名を示しています。
脱出ゲームに限らずFlashでゲームを作る際は第1フレームは空けておくと良いようです。このフレームは初期化と呼ばれる、ゲーム開始時のゲームの状態(点数は0点とか)を設定するスクリプトを書くための場所として使います。(背景が入ってしまってますが気にしないでください)
■最初に画像を設定していきます。
室内レイヤー:全てをキーフレームに変換して、各フレームに画像を挿入してください。種類はなんでもよいです。
背景レイヤー:最初のフレームから最後のフレームまで繋がった一つのフレームです。これも画像はなんでもよいです。
ボタンレイヤー:全てをキーフレームに変換して、各フレームに画像を挿入してください。室内の移動に使うボタンの画像を挿入します。ボタンの画像はムービークリップに設定してください。
ムービークリップには、名前を設定できます。
第2フレームに配置したボタンの名前を、
左側のボタン:prev_btn1
右側のボタン:next_btn1
と設定してください。以下同様にして、
第3フレーム
左側のボタン:prev_btn2
右側のボタン:next_btn2
第4フレーム
左側のボタン:prev_btn3
右側のボタン:next_btn3
第五フレーム
左側のボタン:prev_btn4
右側のボタン:next_btn4
と設定します。
次にラベルレイヤーを用意して、第2フレームにラベル名「room1」を設定します。
以下、第3フレームから第5フレームに、それぞれ「room2」~「room4」と設定していきます。
以上で必要な準備は終了しました。再生すると室内画像が何周もループするファイルが作成されます。
後はActionレイヤーにアクションスクリプトを書くだけです。が、疲れたのでまた明日。
うーん何も考えずに適当に書いたせいで説明が分かりにくくなってる気がする。以前に書いた分は後から書き直すかもしれません。あるいはチョコチョコと修正いれるか。
以下のような構成でレイヤーを作成してください。各レイヤーの名前は自分の分かりやすいものでかまいません。

上から順番に
1、action アクションスクリプトを書くためのレイヤー
2、ラベル プロパティに表示されるラベルを設定するレイヤー
3、ボタン 部屋の移動に使うボタンを置くレイヤー
4、室内 四つの部屋画像を置くレイヤー
5、背景 画面全体の背景となる画像(茶色に設定しています)
となっています。
この時、各レイヤーの第1フレームを空白のフレームにして、使うのは第2フレームからにしておいてください(背景レイヤーはどちらでもいいです)。
まずラベルレイヤーの2~5の各フレームに「room1」~「room4」とプロパティから設定します。各フレームに旗の画像がつきます。

次にボタンの画像をムービークリップに変換します。「挿入」→「新規シンボル」から「種類」をムービークリップに設定してボタン画像を作成してください。完成したら自動的に新しいシンボル(ムービークリップ)がライブラリに挿入されます。
できあがったボタンのムービークリップをボタンレイヤーが選択された状態にして、画面に設置していきます。2フレーム目にボタンを設置してから、そのフレームをF6ボタンで増やすと楽です。
増やしたら、各ボタンのプロパティで名前を付けていきます。名前は半角英数で付けてください。各ボタンの名前がかぶらないように設定しないいけないので、今回は「room1」の場合、右向きボタンに「next_btn1」左向きボタンに「prev_btn1」と付けています。数字は、ボタンと同じフレームの部屋の数字と同じにしています。

室内レイヤーでは室内画像を設定します。これは読み込んだ画像をそのまま使えばOKです。ただし、画面の下部が取得したアイテムを表示するスペースになりますので、ゲーム画面の下側にそのためのスペースを残してください。
背景の設定はどうでもいいですが、取得したアイテム表示用の枠などを作ると見栄えがよくなります。

この状態で「デバッグ」→「ムービーのデバッグ」→「デバッグ」でFlashを再生すると、ムービーがループしてポケモンフラッシュ状態になるので、これをなんとかします。
actionレイヤーの2フレーム目を選択して「ウィンドウ」→「アクション」をクリック(またはF9)。アクションスクリプトを書くためウィンドウを表示させて、
stop();
と記述します。

これで、2フレーム目まででムービーの再生が停止します。
上から順番に
1、action アクションスクリプトを書くためのレイヤー
2、ラベル プロパティに表示されるラベルを設定するレイヤー
3、ボタン 部屋の移動に使うボタンを置くレイヤー
4、室内 四つの部屋画像を置くレイヤー
5、背景 画面全体の背景となる画像(茶色に設定しています)
となっています。
この時、各レイヤーの第1フレームを空白のフレームにして、使うのは第2フレームからにしておいてください(背景レイヤーはどちらでもいいです)。
まずラベルレイヤーの2~5の各フレームに「room1」~「room4」とプロパティから設定します。各フレームに旗の画像がつきます。
次にボタンの画像をムービークリップに変換します。「挿入」→「新規シンボル」から「種類」をムービークリップに設定してボタン画像を作成してください。完成したら自動的に新しいシンボル(ムービークリップ)がライブラリに挿入されます。
できあがったボタンのムービークリップをボタンレイヤーが選択された状態にして、画面に設置していきます。2フレーム目にボタンを設置してから、そのフレームをF6ボタンで増やすと楽です。
増やしたら、各ボタンのプロパティで名前を付けていきます。名前は半角英数で付けてください。各ボタンの名前がかぶらないように設定しないいけないので、今回は「room1」の場合、右向きボタンに「next_btn1」左向きボタンに「prev_btn1」と付けています。数字は、ボタンと同じフレームの部屋の数字と同じにしています。
室内レイヤーでは室内画像を設定します。これは読み込んだ画像をそのまま使えばOKです。ただし、画面の下部が取得したアイテムを表示するスペースになりますので、ゲーム画面の下側にそのためのスペースを残してください。
背景の設定はどうでもいいですが、取得したアイテム表示用の枠などを作ると見栄えがよくなります。
この状態で「デバッグ」→「ムービーのデバッグ」→「デバッグ」でFlashを再生すると、ムービーがループしてポケモンフラッシュ状態になるので、これをなんとかします。
actionレイヤーの2フレーム目を選択して「ウィンドウ」→「アクション」をクリック(またはF9)。アクションスクリプトを書くためウィンドウを表示させて、
stop();
と記述します。
これで、2フレーム目まででムービーの再生が停止します。