[AS3メモ] タイムラインの制御・UIコンポーネント
ボタン操作により、子ムービークリップ内のタイムラインを移動するみたいな事をやってみました。なお、すべてのインスタンスはFlashで静的に配置してあります。
ボタンをクリックすると、表情が変わります。クリックされたボタンは選択状態をキープし、ほかのボタンは非選択状態になります(ラジオボタンっぽい動作を手動で書いています)
追記:Buttonコンポーネントがうまく動いてません>< ローカルで試した時は大丈夫だったんだけどなあ。。←追記:修正しました。NucleusプラグインNP_znFlash に渡すパラメータが不足していました(背景がTransparentになってたのでButtonコンポーネントのスキンが表示されなかったっぽい)
- 顔はムービークリップインスタンス"face"となっており、それぞれの表情を配置してあります。
- キーフレームのラベル名"natural"に普通の顔のグラフィック
- キーフレームのラベル名"smile"に笑った顔のグラフィック
- キーフレームのラベル名"angry"に怒った顔のグラフィック
- 各ボタンはFlashのコンポーネント"Button"を使っていて、パラメータパネルで labelを設定(「ふつう」「わらう」「おこる」)、toggle = true にしてあります。その他のパラメータはデフォルトまま。
また、各ボタンには btn_natural, btn_smile, btn_angry とそれぞれインスタンス名をつけてあります。
子MCのタイムラインです。目とまゆげと口がそれぞれのキーフレームに配置されています。
そしてメインタイムラインの1フレに書いたスクリプトです。
face.stop();//子MC"face"を停止しておく。
btn_natural.buttonMode = true;//コンポーネントをボタンモードにする
btn_natural.useHandCursor = true;//ボタンの上にカーソルが来たらハンドカーソルにする
btn_natural.addEventListener ( MouseEvent.CLICK, btnNatural );//イベントリスナ追加
btn_smile.buttonMode = true;
btn_smile.useHandCursor = true;
btn_smile.addEventListener ( MouseEvent.CLICK, btnSmile );
btn_angry.buttonMode = true;
btn_angry.useHandCursor = true;
btn_angry.addEventListener ( MouseEvent.CLICK, btnAngry );
/*マウスイベント*/
//「ふつう」ボタンをクリックされた場合
function btnNatural ( Event:MouseEvent ):void
{
face.gotoAndStop("natural"); //子MC"face"のラベル名"natural"に移動、停止
this.selected = true; //このボタンを選択状態に
btn_smile.selected = false; //ほかのボタンを非選択状態に
btn_angry.selected = false; //同上
}
//「わらう」ボタンをクリックされた場合
function btnSmile ( Event:MouseEvent ):void
{
face.gotoAndStop("smile");
this.selected = true;
btn_natural.selected = false;
btn_angry.selected = false;
}
//「おこる」ボタンをクリックされた場合
function btnAngry ( Event:MouseEvent ):void
{
face.gotoAndStop("angry");
this.selected = true;
btn_natural.selected = false;
btn_smile.selected = false;
}
このように、この程度のフレーム移動だったら以前のASと一緒っぽいですので、AS1/2書ける人はサクっと書けると思われます。
あとコンポーネントのButtonを使う場合、デフォルトだとハンドカーソルに変わりませんでしたので、buttonMode = true および btn_natural.useHandCursor = true を各ボタンに設定してあります。
++ Posted at 07/07/12(Thu)12:41:23 ++


airline tickets さんのコメント:
hrhfrhf4r49r4993