イラストレータで書き出したSWFファイルにロードバーを付ける

質問

紙ベースで作成した冊子をWeb化する作業をしています。基本的なインターフェイスはHTMLで組んだのですが、中身の冊子部分は省力化とフォント等のイメージを重視したいのでイラストレータで作ってある冊子のデータを流用する予定です。しかし単にJPEGなどの画像にするのでは芸がありませんし、PDFでは重すぎます。そこでイラストレータＣＳのSWFを書き出し機能を使ってFlashで作ろうと思っています。（なので動きはありません）とはいえ一枚300kb前後あり、表示されるのにワンテンポ遅れます。ナローバンドではもっと顕著になると思います。
そこで僅かな時間ではありますが、冊子のイメージが表示されるまで、まず、「Loding...」とメッセージが出せないかなと考えています。

スライドバーが伸びたり「ＸＸ％読み込み中」とか表示出来ればベストですが、そこまで求めません。とりあえず読み込んでいるという事を伝えたいので単純なメッセージが出せないかな？と考えています。

どうやったら良いでしょうか？、Flash MX 2004 Proは持っています。

回答No.2

DPE · ベストアンサー

＃１です。度々すみません。

＃１の方法ですと、Illustrator で書き出した swf ファイルとこのファイルを読み込むための swf ファイルの、２つのムービーが必要になってしまいます。
Illustrator で作った swf ファイルを Flash のライブラリに読み込み、このファイルに Now Loading 画面を作れば、swf ファイルは１つで済みます。
今回の場合はこちらの方が簡単かと思いますので、この方法をご紹介します。

「新規作成」で新しいムービーを作り、「ファイル」→「読み込み」→「ライブラリに読み込み」で、Illustrator で作った swf ファイルを読み込んでください。読み込んだ swf ファイルが、ムービークリップになってライブラリに登録されます。

Now Loading 画面は２フレームで作ります。
フレーム１と２に空白のキーフレームを作り、フレーム２に次のようなスクリプトを書きます。

（↓各行頭に全角のスペースが入っています。コピーして使う時は、全て半角のスペースかタブに置き換えてください。このまま使うとシンタックスエラーになります）

　//ロード完了率の算出
　loaded = _root.getBytesLoaded();
　total = _root.getBytesTotal();
　loaded_per = Math.floor( loaded / total * 100 );

　//ロード完了を待つ
　if( loaded_per < 100 )
　{
　　gotoAndPlay( 1 );
　}
　else
　{
　　//次のフレームでタイムラインを止める
　　nextFrame();
　}

変数 loaded_per に、ロード完了率が％で入ります。ダイナミックテキストで表示するか、プログレスバーの描画に利用してください。
ロード完了率はフレーム１から２まで表示します。

フレーム３にキーフレームを作り、ライブラリから先ほど読み込んだ swf ファイルのムービークリップを配置して、完成です。
アクションとロード完了率の表示・ムービークリップは、それぞれ別のレイヤーを作って管理すると分かりやすくなります。

swf ファイルをライブラリに読み込むと、トゥイーンがキーフレームに変換されてフレームアニメになったり、一部のスクリプトが正常に動かなくなる場合もあります。
今回はアニメではなく静止画とのことですので、ライブラリに読み込んでも問題はないかと思います。

ちなみに、Flash MX 2004 からは Illustrator 10 の ai ファイルが読み込めるようになりました。
しかし、細かい線が欠けたりマスクが外れたりすることもあり、Illustrator で作成した絵を 100 ％完璧に持ち込めるわけではなさそうです。

お礼

ご丁寧にありがとうございました。試した所、うまく出来ました。大変感謝しています！

回答No.1

DPE

以前、別の質問で、外部から読み込む画像に対して Now Loading 表示を出す方法をご紹介しましたので、よろしければご参照ください。（＃２です）

　・外部JPGを読み込んだ場合のローディング表示方法
　　http://okweb.jp/kotaeru.php3?q=1286594

control ＋クリックという操作は、Windows では右クリックにあたります。
上記の質問は JPEG 画像の読み込みになっていますが、swf ファイルも全く同じ要領で読み込めます。コンポーネントのパラメータに swf ファイルの URL を指定してください。