Flashを使ったフェードインフォトアルバムの制作第2回 
ベースになるサンプル制作(2) 
ボタンシンボルの作成/インスタンス名の設定/フレームラベルの設定

←前回の手順

  1. 前回の続きから作ります。前回のファイルがない方は、前回までの完成サンプルを使用します。photoAlbum_before.lzh
  2. [挿入]メニューから[新規シンボル]をクリック。
    「名前:btNav」「タイプ:ボタン」と設定する。[OK]ボタンをクリック。
  3. 画面はシンボルの編集画面に切り替わる。シーン1とは別な次元です。
  4. シンボルとは、再利用可能なオブジェクトで内部に独立したタイムラインを保持できます。おさえておきたいのは、「ムービークリップ」「ボタン」「グラフィック」の三種類のシンボルです。ボタンシンボルがもっとも特殊なシンボルです。
    ボタンシンボルは名前がついた「4つのフレーム」を持ち、マウスの状態によって表示するフレームが切り替わる。[ヒット]フレームは、マウスの当たり判定領域を示すフレームで、画面には表示されない。[アップ]が通常の状態、[オーバー]は当たり判定領域にマウスがのった状態、[ダウン]は当たり判定領域にマウスが押された状態に表示されるフレーム。
  5. [オーバー]フレームをクリックして「F6」を押してキーフレームを挿入します。
  6. [矩形ツール]をクリック。ステージ内を任意にドラッグする。

  7. [選択ツール]で、ステージの長方形をダブルクリック。線と塗りの両方が選択されます。

  8. [プロパティインスペクタ]で、[縦横比の固定]をオフ、「W:100 H:75 X:0 Y:0」「線:赤」→「極細線」、「塗り:白」と設定します。
  9. [カラーミキサー]パネルで[塗り]を選択して、「アルファ50%」と設定します。
  10. [オーバー]フレームしかないフレームを作りました。
    これは通常では透明の表示で、当たり判定領域にマウスがのると半透明の白と赤い線が表示されるボタンになります。
  11. [シーン1]をクリック。シンボルの外にでることができます。
  12. 新規レイヤーを作成します。「nav」と名前をつけます。
  13. [ライブラリ]パネルから[btNav]シンボルをドラッグアンドドロップして、コピーをして、三枚のサムネールの写真に重ねよう。
  14. [選択ツール]で、一番左の水色の透明ボタン([btNav]インスタンス)だけをクリック。
    この時、ダブルクリックしやすいので注意したい。ダブルクリックすると、ボタンシンボルの内部に切り替わってしまいます。
    うっかり、シンボルの中にはいったときは、[シーン1]をクリックします。

  15. [プロパティインスペクタ]で「インスタンス名:photo1_btn」と設定します。「Enterキー」で確定。
    インスタンス名は任意の名前が使えますが、半角英数字を使い、頭に数字をつけないようにします。
    インスタンス名は、あとでActionScriptで制御するときに使います。インスタンス名はいまの段階では気にする必要はない、付け忘れに注意したい。
  16. 同様に、二枚目以降も「インスタンス名:photo2_btn」「インスタンス名:photo3_btn」と設定します。
  17. [ウインドウ]メニューから[ムービーエクスプローラー]をクリック。
    インスタンス名の確認、同じシンボルをつかっていることも確認できる。確認したら[ムービーエクスプローラー]を閉じておきます。
  18. 新規レイヤーを作成する。「label」とする。
  19. [label]レイヤーの[フレーム10][フレーム20][フレーム30]それぞれをクリック。「F6」を押す。
  20. [label]レイヤーの[フレーム10]をクリック。[プロパティインスペクタ]で「ラベル名:photo1」と設定する。「Enterキー」で確定。
  21. 同様に、[フレーム20][フレーム30]にもそれぞれ「ラベル名:photo2」「ラベル名:photo3」を設定する。
    タイムラインをみると、赤い小さい旗がたっている。タイムラインを切り分けるときにこのフレームラベルをよく使われます。
  22. [ファイル]メニューから[保存]をクリック。今回はここまでです。次回に続きます