前回は，シーンの構成や外部リンクなどのサイトの一部を作成しました。後半となる今回で，サイトを完成させます。
シーンの作成
まず，「動物の写真一覧」ページにあたるシーンを作成しましょう。前回作成した「about」シーンと全く同じ作成方法になります。シーンの名前は「gallery」とします。それでは，「index.fla」のアクションを開いて設定を行っていきましょう。
リスト1 「gallery」シーンの作成
// シーンを作成します。
var gallery:SceneObject = new SceneObject();
// シーンに名前を設定します。
gallery.name = "gallery";
// シーンをルートに追加します。
manager.root.addScene( gallery );
子シーンの作成
続いて，「動物の詳細」ページにあたるシーンを作成していきます。「動物の詳細」ページは3ページありますが，これらは「gallery」シーンの下に追加されるシーンになりますので，「gallery」インスタンスで「addScene()」メソッドを使用しシーンを追加します。
作成するシーンは，それぞれ「american」「french」「mame」シーンとなります。
リスト2 「american」シーンの作成
// americanシーンを作成します。
var american:SceneObject = new SceneObject();
// シーンの名前を設定します。
american.name = "american";
// シーンをgalleryに追加します。
gallery.addScene( american );
リスト3 「french」シーンの作成
// frenchシーンを作成します。
var french:SceneObject = new SceneObject();
// シーンの名前を設定します。
french.name = "french";
// シーンをgalleryに追加します。
gallery.addScene( french);
リスト4 「mame」シーンの作成
// mameシーンを作成します。
var mame:SceneObject = new SceneObject();
// シーンの名前を設定します。
mame.name = "mame";
// シーンをgalleryに追加します。
gallery.addScene( mame);
これで，サンプルサイトを構成するシーンはすべて完成です。
ボタンの作成
それでは，作成した「gallery」シーンに遷移するボタンの設定を行います。シンボル内にある「GalleryButton」を選択してください。前回の「AboutButton」と同じように設定を行っていきます。タイムラインに「component」レイヤーを作成し，「RollOverButton」コンポーネントを設置します。コンポーネントインスペクタから「scenePath」の値を[/index/gallery]に設定します。
図1 シーンパスの設定
ロールオーバーの設定
「GalleryButton」も「トップ」ページのボタンですので「AboutButton」と同様にロールオーバーのエフェクトを設定しましょう。タイムライン上で「effect」レイヤーを作成し，シンボルから「Effect」を設置します。「effect」レイヤーの1フレーム目で「Effect」のアルファ値を0に，座標を[x:-70 , y:0]に設定します。8フレーム目にキーフレームを挿入し，「Effect」のアルファ値を100に，座標を[x：0 , y:0]に設定しましょう。
図2 ロールオーバーの設定
ボタンの表示
ボタンの設定が完了したら，ステージに配置しましょう。タイムラインの「stage」レイヤー1フレーム目で「GalleryButton」を設置します。座標は[x:0 , y:284]です。
図3 「GalleryButton」ボタンの設置
設置が完了したら，ムービーを書き出して確認しましょう。
図4 ボタン表示確認
表示されている「GalleryButton」をクリックすると，Flash のログ上でシーン遷移しているのが確認できます。
図5 シーン遷移確認
