TOSSランド＞TOSSコミュニティ＞その他
【山田庵】／ TOSSランド建設／ Flash 使い方教室２／ 課題１７

Flash 使い方教室２〜初級スクリプト編〜

作成者：TOSSオホーツク・ 山田正和
作成日：2005年1月12日(水)
最終更新日：2005年1月14日(金)
©Two-Way All rights reserved
TOSSランドは世界一の教育情報ポータルサイトです。
TOSSランドの正式名称はインターネットランド（登録商標4468327号）と言います。

課題１７：得点ごとに違うページに飛びなさい。→else if

●ステップ１：２段階で評定しなさい。（前回の復習）

  1. まずは前回の復習をします。（趣意説明）
  2. 練習用ファイルをダウンロードしなさい。

    →練習用ファイル（kadai17.fla）

  3. ダウンロードしたファイルをダブルクリック。
    "Flash"が起動し、ファイルを開きます。
  4. この練習用ファイルは、「２択クイズ」のサンプルです。
    前回（課題１６）使用したものを、ほんの少しだけ改造しました。(*1)
  5. 「タイムライン」で、「スクリプト」レイヤーのロックを解除しなさい。

  6. 「タイムライン」の、「スクリプト」レイヤーの、７フレーム目（後から３つ目）をクリック。
    前回より全体で１フレーム増えているので、注意してください。

  7. そのまま右クリック→「空白キーフレームの挿入」。
    ７フレーム目に、空っぽのキーフレームを意味する白丸が追加されました。

    よく見ると、６フレーム目と８フレーム目に、縦長の長方形が追加されています。
  8. そのまま（「スクリプト」レイヤーの７フレーム目が反転表示されたまま）、「アクション」パネルを開きなさい。
  9. 「アクション」パネルに次のスクリプトを書き込みなさい。(*2)
    もちろん「半角英数」で書き込みます。 
    if (X >= 80) {
	nextFrame();
}
  10. 「Ctrl」＋「Enter」で「ムービー・プレビュー」しなさい。
  11. 80点以上と、それ以外の点数をとって、結果を比べてご覧なさい。
    ちなみに「Ａ→Ｂ→Ａ→Ａ→Ｂ」で100点になります。
  12. 「80点以上」と「それ以外（80点未満）」の、２段階で評定されればＯＫです。

    ・評定Ａ：点数が80点以上→「合格おめでとうページ」
    ・評定Ｂ：それ以外の点数（80点未満）→「普通のページ（結果発表ページ）」

  13. 「ムービー・プレビュー」を終了しなさい。
  14. このステップで書いたスクリプトは、２段階評定（ＡＢ評定）のためのものでした。(*4) 
    if (X >= 80) {		[1]点数が80点以上なら、
	nextFrame();	次のフレームに行きなさい。
}
[2]それ以外の点数は、そのまま今いるフレームに留まりなさい。
（[2]の命令は、明記されていない）

  15. 次のステップでは、３段階評定（ＡＢＣ評定）のスクリプトを学習します。

*1：違いは１フレーム多くなっていることです。
　末尾に追加されたフレームは、ステップ２で使います。
　今は気にしないでください。

*2："if()"はキーボードを「ESC」→「Ｉ」→「Ｆ」です。
　"nextFrame();"はキーボードを「ESC」→「Ｎ」→「Ｆ」です。
　最後にシマシマ（縞々）のマークをクリックすると、書き込んだスクリプトが自動整形（フォーマット）されて見やすくなります。(*3)

*3：「Shift」＋「Ctrl」＋「Ｆ」というキーボード操作でも同様の結果になります。

*4：今回の課題ファイルでは、"nextFrame();"の代わりに"gotoAndStop(8);"でも同じ結果（同じ評定を下す）になります。

●ステップ２：３段階で評定しなさい。

  1. ３段階評定のスクリプトを学習します。
    ここでは次のように評定してみましょう。（趣意説明）
    評定Ａ：点数が80点以上
    →100点と80点は、「合格おめでとうページ」
    評定Ｂ：点数が40点以上80点未満
    →60点と40点は、「普通のページ（結果発表ページ）」
    評定Ｃ：点数が40点未満（20点以下)
    →20点と0点は、「頑張ろうページ」
  2. ３段階評定のスクリプトは、２段階評定のスクリプトに書き足すことによって完成します。
  3. 「タイムライン」の、「スクリプト」レイヤーの、７フレーム目をクリック。
  4. そのまま（「スクリプト」レイヤーの７フレーム目が反転表示されたまま）、「アクション」パネルを開きなさい。
  5. 「アクション」パネルの２行目、"nextFrame();"の末尾をクリック。
    「黒の縦線」が点滅します。

  6. そのまま「ESC」→「Ｅ」→「Ｉ」とキーボードを指で押しなさい。
    「アクション」パネルに"else if"と書き足されます。(*1)

  7. 英語表示の「小窓」が開きますが気にしないでください。
    そのままキーボードで、"X<40"と入力しなさい。(*2)

  8. キーボードの「矢印」キーを何度か指で押して、「黒の縦線」を２行目の行末に動かしなさい。(*3)
  9. キーボードを「ESC」→「Ｇ」→「Ｓ」→「９」と指で押しなさい。
    課題７で学習した、"gotoAndStop(9);（９フレーム目に進んで止まれ）"というスクリプトが書き込まれます。

  10. シマシマ（縞々）のマークをクリックしなさい。
    書き込んだスクリプトが自動整形（フォーマット）されて、見やすくなります。

  11. 今書き込んだスクリプトの意味を、体験してもらいます。（趣意説明）
    「Ctrl」＋「Enter」で「ムービー・プレビュー」しなさい。
  12. さまざまな点数をとって、結果を比べてご覧なさい。
    ちなみに「Ａ→Ｂ→Ａ→Ａ→Ｂ」で100点になります。

    →動作確認用白玉ファイル（17a.swf）

  13. 「80点以上」「80点未満〜40点以上」「それ以外（20点以下）」の、３段階で評定されればＯＫです。
    評定Ａ：点数が80点以上
    →100点と80点は、「合格おめでとうページ」
    評定Ｂ：点数が40点以上80点未満
    →60点と40点は、「普通のページ（結果発表ページ）」
    評定Ｃ：点数が40点未満（20点以下)
    →20点と0点は、「頑張ろうページ（ヒントのページ）」
  14. 「ムービー・プレビュー」を終了しなさい。
  15. このステップで書いたスクリプトは、３段階評定（ＡＢＣ評定）のためのものでした。 
    if (X >= 80) {		[1]点数が80点以上なら、
	nextFrame();	次のフレームに行きなさい。
} else if (X<40){		[2]点数が40点未満なら、
	gotoAndStop(9);	９番目のフレームに行きなさい。
}
[3]それ以外の点数は今いるフレームに留まりなさい。
（[3]の命令は、明記されていない）

*1：「ESC」の後に、"else"と"if"の頭文字を押すわけです。

*2："X<40"は、もちろん「Ｘ＜４０（Ｘ・小なり・４０）」の意味です。

*3：勢い余って、次の行（3行目）に行っても構いません。
　今書いているスクリプトの場合、それでも問題なく機能します。

●ステップ３："else if"について読みなさい。

  1. 前のステップで登場した、新しいスクリプトについて学習します。（趣意説明）
  2. "else"は、「他に」「さもないと」という意味の英語です。
  3. "if（もしも〜なら）"に補足説明を書きたい時、"else"の出番となります。
    ですからスクリプトとしては「その他の場合は〜」「それ以外の場合は〜」といった意味になります。
    4. if (条件式) {		[1]条件に当てはまったら、
	指示		指示に従いなさい。
} else 			[2]それ以外の場合は、
	補足説明		補足説明に従いなさい。
}
  4. 補足説明の書き方には、２通りあります。(*1)
  5. １つ目の書き方は、追加指示を直接書く方法です。 
    if (X >= 80) {		[1]点数が80点以上なら、
	gotoAndStop(8);	８番目のフレームに行きなさい。
} else {			[2]それ以外の場合は、
	gotoAndStop(9);	９番目のフレームに行きなさい。
}
  6. ２つ目の書き方には、追加の"if（もしも〜なら）"を書く方法です。
    前のステップまでの学習では、こちらの使い方を学習してきました。 
    if (X >= 80) {		[1]点数が80点以上なら、
	gotoAndStop(8);	８番目のフレームに行きなさい。
} else if (X < 40){	[2]点数が40点未満なら、
	gotoAndStop(9);	９番目のフレームに行きなさい。
}
  7. 必要ならば、追加の"if（もしも〜なら）"をもっとたくさん書くこともできます。 
    if (X == 100) {		[1]点数が100点なら、
	gotoAndStop(8);	８番目のフレームに行きなさい。
} else if (X >= 80){	[2]点数が80点以上なら、
	gotoAndStop(9);	９番目のフレームに行きなさい。
} else if (X < 40){	[3]点数が40点未満なら、
	gotoAndStop(10);	10番目のフレームに行きなさい。
} else if (X == 0){	[4]点数が0点なら、
	gotoAndStop(11);	11番目のフレームに行きなさい。
}

*1：２通りの書き方の、どちらを使うべきかは、作品によって異なります。
　どんなフレームが、どのように並んでいるかで違ってくるのです。

●ステップ４：メモを書いておきなさい。

  1. 最後にメモ（覚え書き）の書き方を学習します。（趣意説明）
  2. 「アクション」パネルの２行目、"nextFrame();"の末尾をクリック。
    「黒の縦線」が点滅します。
  3. 「半角英数」で、"//"と書きなさい。
    キーボードで「／（スラッシュ）」を２回押すのです。

  4. 今度は「全角」で、「得点が８０点以上なら、合格ページへ」と書きなさい。
    ワープロやメールソフトの要領で、キーボードを操作するのです。

  5. よく見ると、"//"より後は、薄い灰色の文字になっています。
  6. 今度は「アクション」パネルの４行目、"gotoAndStop(9);"の末尾をクリック。
  7. 「半角英数」で、"//"と書きなさい。
  8. 「全角」で、「得点が４０点未満なら、頑張ろうページへ」と書きなさい。

  9. 「Ctrl」＋「Enter」で「ムービープレビュー」をしてご覧なさい。
    今書き足したスクリプトは、何も影響がありません。
  10. スクリプトの"//"は、「メモ」や「コメント」を意味する記号です。
    作者の都合で「覚え書き」を書いておきたい時に使います。
  11. "//"より後に何を書いても、Flash作品には何も影響を与えません。
  12. "else if"を使って「条件ごとに異なる指示」を書いていると、混乱してくることがあります。
    指示が漏れてしまったり、間違ったページに飛ばしてしまうことがあるのです。(*1)
  13. ですが"//"を使って「覚え書き（メモ）」を書いておくと、混乱を防ぐことができます。
    ぜひ活用してください。(*2)(*3)
  14. なお「覚え書き（メモ）」の書き方には、特に決まった書式はありません。
    より読みやすい書き方を、色々と工夫してみてください。

  15. 長くなって来たので、今回の学習はここまでです。
  16. 「上書き保存」してから、"Flash"を終了しなさい。

*1：作った時は大丈夫でも、しばらく経ってから赤玉ファイルを修正しようとして混乱してしまうこともあります。

*2：もちろん"else if"以外の部分に「覚え書き」を書いても構いません。
　自分が必要だ（忘れそうだ）と思ったことを書いておくと良いでしょう。

*3：途中まで作った赤玉ファイルを、誰かに見てもらうときにも有効です。
　見てもらう人が、ファイルの全体構造を理解する助けになるからです。(*4)

*4：「Flash初心者向けサンプル集」サイトを利用したことはありますか？
　収められているサンプルの中には、「覚え書き（メモ）」を書いたものがたくさんあります。
　初心者向けに色々と書き込んであるのです。
　機会があったら、利用してみてください。

▲このページの先頭に戻る →課題１８へ