FlashでXMLフォトギャラリー

2006-10-25 (水) 10:37
action script

XMLデータを読み込んで、外部jpg画像をFlash上でフォトギャラリーって、すごくそそるテクニックですが、「The Flash Blog » Flash Forward XML Photo Gallery」さんが公開されています。ソース付きです。ありがたや。

XMLファイルは、親子１階層だけのシンプルな構造で、子ノードの属性に、画像のURLと、文言を書いておくだけという手軽さです。

ローカル環境で試してみると１枚目の表示に予想外に時間がかかる（MacOSX&Flash8）ようで、調べてみると、XMLファイルの読み込みと、各値の配列への格納は一瞬で完了していて、MovieClipLoader作成から画像のonLoadCompleteの間で時間がかかっている。別に全写真を読んでいるわけではないので不思議。
２枚目以降は、専用のloadPhoto関数でmclを使い回して画像をロード、こちらは一瞬でロード完了。

FlashとXMLとのシンプルな連携のさせ方は、XMLジェネレータとしてのMovableTypeやPHPとの連携の勉強になりますし、
テキストボックの出し方や、写真のトランジション＆表示時間の制御はFuseで管理していて、FuseKitの勉強になります。

コードを見てナルホド〜と感心したので、どういう仕組みで動いているかをメモしておきます。

ムービークリップ_root.gallery上に、’bmdc@レベル1′と’photo@レベル2のMCを配置、’bmdc’の中には’preload@レベル1(MovieClip)’と’bmd@レベル2(BitmapData)’を配置。

写真が表示された際に関数’tranny’が作動、2秒かけて’photo’の_alphaを100にFuseトゥイーン。0秒後に次の写真を’preload’（このおかげで、次のトランジション時にはロードが済んでいる）し’bmdc.preload’に隠しておく。
5秒後にテキスト関連のMCを1秒かけてスライド、スライド完了後’loadPhoto’実行。’loadPhoto’関数は、現在の表示をbmdにdrawコピーし、’photo’の_alpha=0に（見かけ上の変化はないが、’photo’の表示内容をbmdに転写して、不要な’photo’を一旦非表示にした）。で、その非表示中の’photo’に次の写真をloadClip、この時既にMC’preload’上で写真のロードは完了しているので、即座にloadClipがonLoadCompleteする。そして最初に戻り’tranny’を実行、’photo’（次の写真が非表示で待機状態）の_alphaを２秒かけて表示する。

上に’photo’と’bmd’の２枚が重なっているので’preload’は一度もステージ上に姿を見せず、裏で次の写真をロードし、ストックしておく役割。メイン表示は’photo’でやる。トランジション時に’bmd’に転写するが、すぐに新しい写真をロードした’photo’に覆われてしまう。写真の処理に関しては大体こんな感じ。

不適切なタイミングでにonLoadCompleteが動いたり、余計にMovieClipLoaderを作ったりするのを防ぐため、仮ストック用にはloadMovieしてる点に注目。loadMovieでロードしておいた画像キャッシュ(?)はloadClipに引き継げるということでいいでしょうか。

DelegateとかFuseのscopeとかもなんとなくイメージできるようになってきました。あとはこういうサンプルを作る立場になれるように頑張るだけ。勉強せな！

Comments:0

Trackbacks:0

Trackback URL for this entry: http://www.trick7.com/blog/2006/10/25-103744.php/trackback
Listed below are links to weblogs that reference: FlashでXMLフォトギャラリー from trick7

Here are my twitter delicious tumblr hatena booklog kskl ハモニナペアゲー

ブログ内検索

最近の投稿

カテゴリー

アーカイブ


AS3習得本: AS3の全容を学習できる本。この中でどれか1冊自分に合ったものを。
AS3発展本: ASでアニメーションさせる面白さを知るための本。
AS2: "Flash"ではなく"ActionScript2.0"学習のための良著。他にもいろいろ読んだけど、この4冊を読んだ後、自分が成長できた感じがしました。

Return to page top