Flash演習-徘徊するドットが描くイラスト



O’reillyの『Flash Hacks』に紹介されているHACK #2を応用してちょっとしたコンテンツを作ってみた。
「RANDOM」「FACE1」「FACE2」の3つのボタンがある。
ステージ上には2×2ピクセルのドットがランダムに散乱している。「FACE1」「FACE2」のボタンをクリックするとそれらのドットが徘徊して、ある人物の顔を描いていく。誰の顔かわかる?
ドットが粗い上に、2階調なのでちょっとわかりづらいかも。一人は女優。一人は政治家。
「RANDOM」をクリックすると、ドットが再びランダムに散らばる。

プログラムは超シンプル。ボタンハンドラを除けば空行やコメント行を含めても80ステップに満たない。
swfファイルサイズも8kByteをわずかに超える程度だ。
まずステージ上に、ドットオブジェクト(インスタンス)を2400個生成する。Flash上ではオブジェクトが2500個を超えると急激にパフォーマンスが落ちるらしく、少し余裕を見て2400個とした。
で、ボタンをクリックする度に各ドットオブジェクトに目的地を設定してあげて、ドットのEnterFrameハンドラに、目的地へ移動するメソッドを設定してあげるだけ。このメソッドはHACK本のものをそのまま使った。
絵を描くような目的地をいかにして割り出すかというところがこのHACKのミソなわけだが、けっこう力技。HitTestを使って地道に上からドットを舐めていく。
ActionScript(Macromedia Flash)は、オブジェクト指向を学ぶのに最適なツールだと思う。
オブジェクトがそのまま目に見える物体になる。メソッドはその挙動になる。アトリビュートを変更すればオブジェクトの位置や態様の変化が目に見える。これほど直感的に学べるツールはない。
JavaScriptとかだと、ブラウザ互換だとか本来のプログラミングと関係ない余計な気を遣わないといけないがFlashはプラットフォームが(一応)統一されているので、余計な気遣いも少ない。
オープンソース系の人にはどちらかというと不人気なFlashだが、少しでも興味を持ってくれる人が増えるとよいなー。今後も折を見てFlash演習モノエントリー続けていきます。

Flash Hacks―プロが教えるテクニック&ツール100選
4873112354 シャム バンガル Sham Bhangal クイープ

オライリージャパン 2005-07
売り上げランキング : 5,395

おすすめ平均 star
star他にはないテクニック満載

Amazonで詳しく見る by G-Tools

「Flash演習-徘徊するドットが描くイラスト」への15件のフィードバック

  1. Amiさん>
    おもしろいっしょ。FACEはいくらでも追加できるのですよ。ふふふ。
    遊び人さん>
    マジっすか!??うーーん、そっかー見れない人もいるのか。メモリの問題かもしれない。ドット減らせばいいんですけど、そーすると、絵が途中で終わっちゃったりするので…困りましたね。ちょっと様子みて、場合によっては対策を考えないとだめかなー…むーー。

  2. おおおー久しぶりのすれ違い(・∀・)
    nomadさん>
    やたーーー褒められた!
    誰の顔かはさりげなくスルーされまくってるけどw、みんな軽く判ってるのかな、全然判らないのかな?

  3. 人の顔をおぼえられない私は「この人だぁれ?」的なクイズに全く弱い。写真見て「あーこの人誰だっけなー、えーと」と毎回言ってるタイプの人間なのでした。
    そんな訳で、男性の方が田中邦衛に見えてしまうのは全て私の目と記憶力が問題なのであると思われます。
    女性の方は頭の片隅に何かひっかかるモノがあるのだけれど全くそれ以上出てきません!
    |`・ω・)ノ<いっそ胸を張ってすがすがしい気持ちで元気良く「わかりません!」

  4. しが研さん>
    おー、わかりましたか!FACE1は薄目で見たり、眼鏡の人は裸眼で見たりするとそれっぽく見えるかも。
    でもやっぱ難しいですよね。
    cioさん>
    田中邦衛!!wwww
    そこまでわかってるのならーー♪(いるのならぁ)♪
    きっときがつくおもいだすーー♪(おもいだすぅ)♪
    とりあえず答え合わせはもーすこし引っ張ろう。

  5. 女優って父さんならアノ人に違いない・・って
    先入観もあったせいか、すぐ分かった気が・・
    危険な♡

  6. Amiさん>
    あ、そうそう合ってる合ってるww
    やるなー。そのヒントでわかっちゃうかも。

  7. えへっ。他に誰か正解しているのでしょうか?
    (`・ω・´)ボクは2つとも正解したみたい。エヘッ♡。

  8. しが研さん>
    えっとー、正解者は多分2名!
    でも、おそらく暗黙の正解者多数!Amiさんのヒントがでかいと見たw
    soutaさん>
    どもーー。Macの件ですが、ネスケにはFlashPlayer7を入れてみてください。それで見れるはずです。
    OS9のIEはもー対処不可能なんでごめんなさいごめんなさいごめんな。

  9.  あ、そうか。Amiさんのヒントがありますたm(_ _)m。
     スレ違いですが、私のほうが、2ちゃんねルらーではないことは確実ですが、J2さんが、2ちゃんねルらーであるかどうか判断できないので、保留(棄権?)というかたちで(^^;。
     定義自体不明確だし、J2さんをそういう風にレッテル貼るのはどうかなと思いますので(^^;。

  10. しが研さん>
    「2ちゃんねらー」という言葉は、現状では「レッテル貼り」の意味合いが強すぎますが、今回の企画は「本来はそうではないでしょ?」という暗黙のメッセージが込められてるわけで、投票=レッテル貼りじゃあないですよー。

コメントは停止中です。