« 9月突入! | トップページ | 阿久根泰作! »

2006.09.04

プルダウンメニュー×画像

仕事の話。
左に画像エリア、右に3つのボタンを配置した、下図のようなFlash作成の案件がある。

Sample060904

仕様として、
1)ボタンに触らない場合、画像エリアはABCという3つの画像を一定周期で切り替える。
2)ボタン1にロールオーバーで、プルダウンメニューを出し、画像エリアはAの画像に切り替える。
3)ボタン2,3も上記に準じた処理を行う。(つまりボタン2は画像Bに、ボタン3は画像Cに対応している)

プルダウンメニューは少々やっかいだが、何度となく作っているので、ActionScriptの仕様は割と早く出来上がった。
問題は画像エリア。
通常、3つの画像が一定周期で切り替わる。それは問題ない。また、ボタンにロールオーバーでそれに対応した画像に切り替える。それも問題はない。
問題は、ボタンかそれに付属するプルダウンメニューにロールオーバーしている間は表示されている画像でストップしておいて、ロールアウト後に3つの画像が一定周期で切り替わるように戻してあげるコトだ。

ここで何が問題なのか分からない方は、残念ですがここまでです。お付き合いありがとうございました。

さて、もう1つ問題なのは、単純に画像が切り替わるのではなく、黒背景から演出を入れそれぞれの画像にフェードインし(2.0sec程)、一定時間経つとフェードアウトして次の画像に移るという仕組みになっているコトだ。
なので、画像のフェードイン中に、ボタンからロールアウトしてしまった時の処理も問題になってくる。

いろいろと試行錯誤したあげく、
まず、ボタンにロールオーバーしているかどうかを調べる関数を作り、ボタンに触っていなければ、0という値を入れ、ボタンにロールオーバーしたら、1という値を入れる。その後、ボタンからロールアウトしてしまうと、また0という値を入れ、その関数を画像自体に監視させる。
画像はフェードイン後から監視をはじめ、1ならば画像をある範囲でロープにしておき(つまり、ずっと同じ画像が表示され続ける)、0になると、そのループを無効にして、最後まで再生し次の画像に移る。なので一瞬だけボタンに触り、フェードインが完了していない間にボタンからロールアウトした場合も、監視するタイミングでは関数の値は0に戻っているので、何事もなかったかのように再生を続け、一定時間後、次の画像に切り替わるのである。(あ〜、まどろっこしい文章だ!読んだ人は理解できるんだろうか???)

文章に起こすと何だか複雑だが、ソフト屋さんならすぐに思い付きそうな仕組みである。しかし、これだけでもなんだかんだと半日以上かかってしまった。ホント、プログラムって時間がかかる。

まあ、プログラム上の辻褄を合わせるコトができないコトには、今時Flash使って仕事にならないしね。また1つ勉強になったなぁ。

|

« 9月突入! | トップページ | 阿久根泰作! »

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/35737/11759277

この記事へのトラックバック一覧です: プルダウンメニュー×画像:

« 9月突入! | トップページ | 阿久根泰作! »