- 2006-10-25 (水) 10:37
- action script
XMLデータを読み込んで、外部jpg画像をFlash上でフォトギャラリーって、すごくそそるテクニックですが、「The Flash Blog » Flash Forward XML Photo Gallery」さんが公開されています。ソース付きです。ありがたや。
XMLファイルは、親子1階層だけのシンプルな構造で、子ノードの属性に、画像のURLと、文言を書いておくだけという手軽さです。
ローカル環境で試してみると1枚目の表示に予想外に時間がかかる(MacOSX&Flash8)ようで、調べてみると、XMLファイルの読み込みと、各値の配列への格納は一瞬で完了していて、MovieClipLoader作成から画像のonLoadCompleteの間で時間がかかっている。別に全写真を読んでいるわけではないので不思議。
2枚目以降は、専用の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を2秒かけて表示する。
上に’photo’と’bmd’の2枚が重なっているので’preload’は一度もステージ上に姿を見せず、裏で次の写真をロードし、ストックしておく役割。メイン表示は’photo’でやる。トランジション時に’bmd’に転写するが、すぐに新しい写真をロードした’photo’に覆われてしまう。写真の処理に関しては大体こんな感じ。
不適切なタイミングでにonLoadCompleteが動いたり、余計にMovieClipLoaderを作ったりするのを防ぐため、仮ストック用にはloadMovieしてる点に注目。loadMovieでロードしておいた画像キャッシュ(?)はloadClipに引き継げるということでいいでしょうか。
DelegateとかFuseのscopeとかもなんとなくイメージできるようになってきました。あとはこういうサンプルを作る立場になれるように頑張るだけ。勉強せな!
- Newer: プログラムはなぜ動くのか ― 知っておきたいプログラミングの基礎知識
- Older: tha ltd.
Comments:3
- emi 10-04-09 (金) 18:12
-
いつも参考にさせて頂いています。
初心者ながら、Flash Forward XML Photo Gallery のファイルをダウンロードしました。
しかし、サンプルをそのまま書き出しただけで、
var f:Fuse = new Fuse();が読み込めないとエラーが出てしまいました。CS3を利用してるのですが、何が原因か解りません。
厚かましいお願いですが、教えて頂けたらと思います。
よろしくお願い致します。 - tera 10-04-11 (日) 2:21
-
emiさま
はじめまして。
こちらのサンプルは、FuseKitという別の方が公開されているライブラリをimportして使う仕組みになっているのですが、ダウンロードサンプルにはそのFuseKitが同梱されていません。・FuseKitのダウンロード
http://www.mosessupposes.com/Fuse/その後、gallery.flaのActionScript設定にて、FuseKit一式が入ったフォルダーに対して「クラスパスを通す」作業が必要になります。
詳しくは「FuseKit クラスパス」等で検索いただくと関連情報が得られるかと思います。それでサンプルは動くかと思いますのでよろしくお願い致します。 - emi 10-04-13 (火) 20:45
-
ありがとうございます!!!!
動きました☆ 全然理解していなくてすいません。。。
いきなりの質問に、丁寧に答えて頂いてとてもうれしいです。
ありがとうございます!!
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