Flash記事

Progression Framework 2　初級編：ActionScriptを書かずにFlashサイトを簡単に構築する

ステップ2：InOutMovieコンポーネントで各ページにアニメーションを実装する

Progressionコンポーネント

Progression Framework 2をインストールすると、「Progression Casts」「Progression Commands」「Progression Loader」といったコンポーネント群もインストールされます（図11）。これらのProgressionコンポーネントをムービークリップ内に設置するだけで、ムービークリップの表示・非表示時にアニメーションを実装したり、シーン移動機能のついたボタンを作成したりすることができます。

図 11. Progression Framework 2をインストールすると追加されるコンポーネント群

本記事のサンプルサイトでは、ページ遷移の際、ページがフェードイン／フェードアウトしながら切り替わるようになています。このフェードイン／フェードアウトアニメーションは、Progression Castsコンポーネント群の中のInOutMovieコンポーネントを使って実装しています。

InOutMovieコンポーネント

InOutMovieコンポーネントには、以下の表にあるパラメータが用意されています。このコンポーネントをムービークリップにドラッグ＆ドロップで設置するだけで、そのムービークリップの表示時と非表示時に再生するフレームアニメーションを設定できます。

アイコン	パラメータ	内容
	IN点	ムービークリップを表示する際に再生するアニメーションの開始位置と終了位置のフレームラベルを指定する。
	OUT点	ムービークリップを非表示にする際に再生するアニメーションの開始位置と終了位置のフレームラベルを指定する。
	ツールヒント	バージョン2.0.0 Beta 2では実装されていないため、使用できません。

各ページのフェードイン／フェードアウトアニメーションを設定

TopPageムービークリップ（Indexページ）を例に、 InOutMovieコンポーネントを使ってアニメーションを追加する方法を解説します。まずは、TopPageムービークリップの表示時と非表示時のフレームアニメーションを作成します（図12）。表示時用アニメーションの開始位置にフレームラベル「in」を、終了位置に「stop」ラベルを設定します。非表示アニメーションの停止位置に「out」ラベルを設定します。この例では、「stop」ラベルが、非表示アニメーションの開始位置でもあります。

図 12. TopPageムービークリップの表示時と非表示時のフレームアニメーションとフレームラベル

次に、Componentレイヤーに InOutMovieコンポーネントをドラッグ＆ドロップで設置します（図13）。

図 13. TopPageムービークリップに InOutMovieコンポーネントをドラッグ＆ドロップで設置したところ。コンポーネントのパラメータはデフォルトのままです

以上で表示時と非表示時のアニメーション実装は完了です。その他のページにも同じようにInOutMovieコンポーネントを設置してアニメーションを追加します。