アクセシビリティ
デベロッパーリソース

目次

  1. Progression Framework 2とは
  2. ステップ1：パーツの作成
  3. ステップ2：InOutMovieコンポーネントで各ページにアニメーションを実装する
  4. ステップ3：RollOverButtonコンポーネントで各ボタンにシーン移動機能を追加する
  5. ステップ4： ImageBoxコンポーネントを使って写真を外部から読み込む
  6. ステップ5：EasyCasting機能でサイトのシーン表示をコントロールする

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

ステップ3：RollOverButtonコンポーネントで各ボタンにシーン移動機能を追加する

サンプルでは、ナビゲーションのボタンをクリックして、ページ遷移を行うようになっています。このページ遷移機能は、Progression Castsコンポーネント群の中のRollOverButtonコンポーネントを使って実装しています。また、RollOverButtonという名前が示す通り、このコンポーネントではマウスオーバー時やマウスクリック時のアニメーションも設定することができます。

RollOverButtonコンポーネント

RollOverButtonコンポーネントには、以下の表にあるパラメータが用意されています。このコンポーネントをムービークリップにドラッグ＆ドロップで設置するだけで、そのムービークリップがボタンとして動作するようになります。

アイコン パラメータ 内容
アイコン CURRENT点 「移動先となるシーンパス」パラメータにかかれているシーンにいる時に表示するフレームを指定する。
DISABLE点 クリックできない状態の時に表示するフレームを指定する。
DOWN点 マウスクリック時に再生するアニメーションの開始位置と終了位置のフレームラベルを指定する。
OVER点  ロールオーバー時に再生するアニメーションの開始位置と終了位置のフレームラベルを指定する。
UP点  ボタンからマウスが離れた時に再生するアニメーションの開始位置と終了位置のフレームラベルを指定する。
移動先となるURL 移動先となるURLを指定する。
移動先となるシーンパス 移動先となるシーンのパスを指定する。シーンの設定については「外部XMLに各シーンごとの設定を書き込む」で詳しく説明します。
アクセスキー バージョン2.0.0 Beta 2では実装されていないため、使用できません。
ツールヒント バージョン2.0.0 Beta 2では実装されていないため、使用できません。

各ボタンの設定

ProfileButtonムービークリップ（PROFILEボタン）を例に、 RollOverButtonコンポーネントを使ってページ遷移機能を実装する方法を解説します。まずは、ProfileButtonムービークリップのフレームアニメーションを作成します（図14）。そして、上記のパラメータを参考に、マウスオーバー時やマウスクリック時のフレームラベルを設定します。

図14

図 14. ProfileButtonムービークリップのフレームアニメーションとフレームラベル

次に、ComponentレイヤーにRollOverButtonコンポーネントを設置します（図15）。

図15-1
図15-2

図 15. 「移動先となるシーンパス」に「/index/profile」を入力して、その他のパラメータはデフォルトのままです

以上で、ナビゲーションボタンへのページ遷移機能の実装は完了です。その他のボタンにも同じようにRollOverButtonコンポーネントを設置してアニメーションを実装します。

ページ 4 / 6
前のページ
次のページ