501

単に画像を入れ替えるだけのスライドショーならLesson４までのテクニックで十分ですが、もう少し欲張って様々な「見せ方」を演出することでグレードアップを図りたいものですね(^^g/~~
これまではインスタンスの「効果」で「アルファ値」を変更することで「フェードイン・フェードアウト」というテクニックを使ってきました。
ここではさらに、次の画像が紙芝居のように左から右へ、上から下へと中心の枠の中へ入ってきたり、出て行ったり、中心から円形に出現させたりというようなことも織り交ぜながら、より効果的なスライドショーを演出してみます。
サンプル画像 参照
画像の位置を移動させるのは、フレームの２点にキーフレームを挿入して、ひとつを中央にもうひとつを枠の外に移動して、その間にモーショントゥイーンを設定すればよいことは容易に想像がつきますね(^^g/~~
しかし、それだけでは枠の外にある部分も丸見えになって様になりません（笑）
この見える範囲を枠の中に限定することができれば、この問題は解決できるはずです。
それを実現してくれるのが「マスク」という機能です。

502

「マスク」というと、一般的なイメージでは”覆い隠して見えなくするもの”という感じがしますが、FLASHでいう「マスク機能」とはその逆で”覆い隠した部分だけを見えるようにする”機能だということをまず覚えておいてください。
これも実際に操作して体感していただければ簡単に理解できます。

503

FLASHを起動して、前回までの「test01.fla」ファイルを開いてください。
※もし、前回までのファイルを完成させておられない場合は、以下のファイル名を右クリックし「対象をファイルに保存」で、制作ファイルをダウンロードしてください。
「test01.fla」

504

「写真２レイヤー」のロックを解除して、そこの１２９フレームをクリック。
「インスタンス」タブをクリックして画像の「シンボル名」を確認すると「p02」ですから、そこには２枚目の画像が入っていることが分かります。
次に隣の１３０フレームのキーフレームをクリックして「インスタンス名」を確認すると「p04」となっていますから、 そこから新しく「p04」の画像が始まっていることが分かります。
次に「効果」タブをクリックすると「アルファ０％（完全透明）」となっていますから、実際にステージに見えているのはその下の「写真１レイヤー」の画像ということです。
「アルファ」の右横の▼をクリックして、「なし」を選択すれば、不透明になってステージに「p04」の画像が見えるようになります！

ここまでは以下で「マスク機能」の説明するための下準備ですから、直接マスクとは関係ありません(^^;
※ただし、あとでムービーを修正したりメンテナンスを行う場合のひとつの手順を示しています。

505

１４０フレームのキーフレームをクリック、ステージの画像「p04」が選択されていることを確認して、 「情報パネル」で位置座標をみると”ポイントが左上”のとき「X=20,Y=20」（”ポイントが中心点”のとき 「X=160,Y=125」）となって、これまでの定位置にあります。
１３０フレームのキーフレームをクリックしても当然同じです。
１３０フレームで「情報パネル」の「Y」の値を、枠の高さ（＝画像の縦幅）である”210ピクセル”を加えた数値に変更してください。
※”ポイントが左上”のとき「Y=230」（”ポイントが中心点”のとき「Y=335」）です。
※画像が枠の下辺に移動しますね。勿論、情報パネルによらず手動でドラッグしても構いません。
この間は元々モーショントゥイーンが設定されていましたから、「再生ヘッド」を１３０フレームから１４０フレームにドラッグして移動させれば、画像が下の枠外から枠の中央に入り込んでくるのが確認できます。

506

さて、ここからがいよいよ「マスク」の説明です。
�@マスクを設定するには、マスク専用のレイヤーが別途必要です。これを「マスクレイヤー」といいます。
�A「マスクレイヤー」は「マスクされる対象となる文字や図形、画像の入ったレイヤー」のすぐ上に作成します。
「p04」の画像の入った「写真２レイヤー」がこの場合「マスクの対象」となるレイヤーになりますから、
「写真２レイヤー」の名前のところをクリックして選択（反転）させてから、「レイヤーの追加」アイコンをクリックしてください。
すぐ上に新しくレイヤーが作成されます。新しいレイヤーの名前を「マスク２」とでもしておいてください。
次に「マスク２レイヤー」を右クリックして、ショートカットメニューの「マスク」をクリック。
左図の上の丸の中のように、それぞれレイヤー名のところに「矢印」が入ります。
○上が「マスク（する）」レイヤー
○下が「マスク（される）対象」のレイヤー
という「しるし」です。
このとき、２つのレイヤーは自動的に「ロック」された状態になります。
これは、あとでも説明しますが・・・
”作業画面でマスク機能が働いた状態を確認するとき”は、両方のレイヤーがロックされている必要があるからです。
なぜ、そうなのか？は後ほど分かってきます(*^-^*)

507

「マスク２レイヤー」の”ロックを解除”して、１３０フレームに「空白キーフレームを挿入」してください。
�B「マスクレイヤー」に「マスク（下の対象レイヤーの画像等が見える範囲）」としての任意の図形を描き込みます。
今は「矩形ツール」で、下のステージに枠とほぼ同じ大きさの四角の図形を描いてください。
その際、「線なし」で「塗り」のみの図形としてください。 塗りの色は他と識別できるなら何色でも構いません！！
描いた図形を「（黒）矢印ツール」で選択、「情報パネル」で正確に当初の画像の大きさ及び位置を確定してください。
※「W=280,H=210,X=20,Y=20（ポイントが中心点のとき、X=160,Y=125）」です。
このマスクは他でも使い回ししたいのでこれを「グラフィックシンボル」にします。
マスク図形が選択された状態で、メニューバー挿入→シンボルに変換 、名前を例えば「マスク四角」、タイプを「グラフィック」にチェックして「OK」をクリックでしたね(*^-^*)
※これで「ライブラリ」に「マスク四角」という名のシンボルが登録され、ステージの図形は、そのインスタンスに置き換わりました。

508

ステージではマスク図形のために、今まで見えていた下の「写真１レイヤー」の画像が見えないはずですが、
�C「マスクレイヤー」を”ロック”して、下の「マスク対象」レイヤーともにロックされると、「マスク機能」が働いて、画像が現れます。
この状態で「再生ヘッド」を１３０フレームから１４０フレームの間で、左右にドラッグ移動させてください。
「p04」画像が枠の下から徐々に現れて、中央に納まる様子が確認できます。
これが「マスク機能」です。
※マスクレイヤーのロックが解除された状態でマスク機能が働くと、編集の際に目安がなく編集しにくいため、”ロック”されたときのみ働くようになっていいるのですね(*^-^*)
※マスクとしての図形はその性質上、形だけに意味があって、色などについては全く意味がありません。
※したがって、ロックを解除した状態でも下のレイヤーの状況を確認しながら編集するためには、上記のようにインスタンスにした上で、「効果」で半透明にしておくと作業がしやすくなります。
「マスク２レイヤー」のロックを解除して、マスク図形を選択、「効果パネル」で「アルファ」を「３０％程度」にし、再び「マスク２レイヤー」をロックしておいてください。

509

今、マスクの中へ画像が入ってくるように作成しましたが、画像がマスクから抜け出るときも同じように働くことはご理解いただけると思います。
したがって、対象となる画像等の出方入り方を工夫すれば、これだけでも様々なバリエーションが考えられます。
今度は「p04」画像の出方について工夫してみましょう。
「写真２レイヤー」のロックを解除して、１７０フレームをクリック。
ここは、当初１６０フレームから１７０フレームにかけてモーショントゥイーンを設定し、段階的に「アルファ値」を下げることで「フェードアウト」にしていた部分です。
※１７０フレームは「アルファ０％」ですから、実際に見えているのは下の「写真１レイヤー」の画像です。
１７０フレームでステージの画像（透明）を選択した状態で、ツールボックスの下方「伸縮」をクリック。
画像は見えませんが、変形のための四角の８つのハンドルが画像を囲むように現れます。
角のハンドルのひとつを外側にドラッグして、大きさを適当に拡大してください。
「再生ヘッド」を１６０フレームから１７０フレームにかけてドラッグすると、画像が拡大しながら枠をはみ出て消えていくはずです。
ここで「写真２レイヤー」をロックして同じように「再生ヘッド」をスライドしてください。
「マスク」の範囲内で拡大しながら消えていき、その下の画像が現れてきますね。
面白くなってきませんか（笑）

510

上の例は「マスク図形」を固定したまま「対象となる画像」を移動させました。
次は「対象となる画像」を固定し、「マスク図形」を変化させてみます。

「マスク２レイヤー」の１９０フレーム（「p06」画像の始まり）に「空白キーフレームを挿入」（「マスク四角」がなくなります）。
「マスク２レイヤー」のロックを解除し、枠の中心付近に「楕円ツール」で正円図形を描いてください。
※”507”の場合と同じく、「線なし」「塗りのみ」。正円は「Shift」キーを押しながら描くのでしたね。
それをまず「シンボルに変換」してください。
「（黒）矢印ツール」で円を選択、メニューバー挿入→シンボルに変換、名前を例えば「マスク円」、タイプを「グラフィック」として「OK」をクリック。
”508”後段のように、編集作業をしやすくするために、マスク図形を半透明（「効果」→「アルファ３０％程度」）にします。
「情報パネル」を使って、”ポイントを中心点”に設定して「X=160,Y=125」と入力、円を正確に枠の中心に移動します。
さらに、ツールボックスの下方「伸縮」をクリックして、変形ハンドルの角のひとつをドラッグして、円が「対象レイヤー」の画像を完全に覆い隠すまで拡大します。
※「情報パネル」で確認すると「W=350,H=350」の円になるはずです。
続いて ２００フレームに「キーフレームを挿入」、１９０フレームと同じ「マスク円」インスタンスが複写されます。
もう一度、１９０フレームに戻ってキーフレームをクリックして、ステージの「マスク円」を選択、「情報パネル」で大きさを「W=10,H=10」程度に縮小してください。
そのままの状態（選択）で「フレームパネル」で「モーショントゥイーン」を設定します。
これで「マスク円」が１９０フレームから２００フレームにかけて拡大していきます。
「マスク２レイヤー」「写真２レイヤー」ともロックして、「再生ヘッド」を左右に異動して見え方を確認してください。
「p06」の画像が中央から「マスク円」の拡大にあわせて表示されるのが確認できるでしょう(^^g/~~
ここで「p06」の初期の状態が透明なので、もっとくっきり見せたいときは、「写真２レイヤー」のロックを解除し、１９０フレームをクリック、「効果パネル」で「アルファ０％」を「なし」に変更するとともに、「フレームパネル」で「トゥイーン」「なし」に変更。
そうなると２００フレームのキーフレーム（同じように「効果」「なし」）は無駄になりますから、ここを右クリック「キーフレームの削除」をクリックしてキーフレームを削除しておきます。
それで再度「写真２レイヤー」をロックして、見え方を確認してください。
「マスク円」の拡大速度をゆっくりしたいときは、再生ヘッドの位置で１９０フレームと１９９フレームの間をクリック（フレームが選択されていない状態で）、「F５キー」を押して適当にその間のフレーム数を増やしてください。
ここでは、５回押して２００フレームを２０５フレームまで延ばしておいてください。
※反対に拡大速度を速めたいときは、「Shift＋F５キー」を押すことでフレーム数を減らします。

511

次、 「p06」は、先ほど５フレーム延ばしたので、２２５フレームから２３５フレームにかけて「フェードアウト」で消えるようになっていますが、 まずこのフェードアウトを取り消します。
「写真２レイヤー」の２３５フレームの画像は「効果」「アルファ０％」なので、実質的に２３６フレーム以降は「p06」の画像は必要ありませんね。
そこで、２３６フレームを右クリックして「空白キーフレームを挿入」し、以降画像を空にします。
２２５フレームから２３５フレームの「フェードアウト」も必要ないので、それぞれ右クリックして「キーフレームを削除」します。
これで「対象となる画像＝p06」は１９０フレームから２３５フレームまで何の変化も無く、完全に固定できました。
ここでも「マスク」だけを使って、「p06」を閉じるときに”観音開きの逆閉じ”をやって消してみます。
「マスク２レイヤー」のロックを解除して、２２５フレームに「空白キーフレームを挿入」（「マスク円」がなくなります）。
ステージに「ライブラリ」から「マスク四角」をドラッグします。「効果パネル」で「アルファ３０％」に設定。
それを「情報パネル」で枠と同じ位置に正確に配置してください。（ポイントが中心点のとき「X=160,Y=125」）
次に２３５フレームに「キーフレームを挿入」すると、２２５フレームと同じ大きさ及び位置の「マスク四角」が複写されます。
そのまま「情報パネル」で横幅を「W=10」として、２３５フレームの「マスク四角」の幅のみを縮小（「伸縮」でハンドルを移動しても構いません）。
２２５フレームをクリックして「フレームパネル」で、トゥイーンを「モーション」として「モーショントゥイーン」を設定します。
「再生ヘッド」で動きを確認すると、２２５フレームから２３５フレームにかけて「マスク四角」の幅が中央に収縮していきます。
「マスク２レイヤー」「写真２レイヤー」ともにロックして、見え方を確認してください。
「p06」画像が観音開きの逆に閉じていくのが見えるでしょう・・・
※観音開きは、画像を出現させる際に、キーフレームに入る「マスク図形」の大小を逆にするだけです。。
※この部分も適当にフレームの増減を行って開閉速度の調整を行ってください。
ここでは、再生ヘッドの位置で２２５フレームと２３４フレームの間をクリック、（フレームが選択されていない状態で）「F５キー」を５回押し、２３５フレームを２４０フレームまで延ばしておいてください。

512

このように「マスク図形」と「対象となる画像」を変化させることによって、様々な形の画像の入れ替えができます。
また「マスク図形」には「文字」も使えますので、タイトルの切り抜き文字のような形で画像を表示することもできます。

↑ このムービーのflaファイル「test02.fla」です。別途ハードディスクに取り込んでご参考にしてください。
※リンクを右クリックして「対象をファイルに保存」をクリック。保存先フォルダを指定して「保存」をクリックして取り込んでください。

513

以上で「マスク機能」の説明を終えますが、「Lesson３」の”302”でサンプルとして、こちらで用意した画像のうち、未使用のものがあります。
特に画像サイズが「280×300」で枠より縦長の「p08,jpg」が残っています。
このような縦長画像や横長画像は、枠の中でゆっくりスライドさせて見せるのも面白いテクニックです(*^-^*)
残りの「p09,jpg」「p10.jpg」の仕上げも含めて、これまでの応用ですから、以下に解説無しで手順だけを記載します。
お時間があれば復習の意味でトライしてください。

514

再生ヘッドの位置で２４１フレームと２４９フレームの間をクリック（フレームが選択されていない状態で）、「F５キー」を１５回押し、２５０フレームを２６５フレームまで延ばしてください。
「マスク２レイヤー」のロックを解除、２６０フレームに「キーフレームを挿入」。
「情報パネル」で「マスク四角」の幅を元の枠の大きさ「W=280」に変更。
「マスク２レイヤー」をロック。
「写真２レイヤー」のロックを解除、２６０フレームに「空白キーフレームを挿入」。
メニューバーファイル→読み込みで「p08.jpg」を読み込む。
メニューバー挿入→シンボルに変換で、名前を「p08」、タイプを「グラフィック」にして「OK」。
「情報パネル」で”ポイントを中心点”に設定して「X=160,Y=80」と入力 （枠の下辺に画像下辺を合わせて配置します）。
再生ヘッドの位置で２６０フレームと２６４フレームの間をクリック（フレームが選択されていない状態で）、「F５キー」を５０回押し、「タイトルレイヤー」の２６５フレームが３１５フレームにくるまでフレームを延ばします。
「写真２レイヤー」の２７０フレームに「キーフレームを挿入」。
２６０フレームをクリック、ステージの画像が選択されているのを確認して「効果パネル」で「アルファ０％」に設定。
そのまま「フレームパネル」で「モーショントゥイーン」を設定。
同じく２８０フレームと３００フレームに「キーフレームを挿入」。
３００フレームのキーフレームをクリックして、ステージの画像が選択された状態で、「情報パネル」で「Y=170」に変更（枠の上辺に画像の上辺をあわせるように配置します）。
２８０フレームをクリック、「フレームパネル」で「モーショントゥイーン」を設定。
「写真２レイヤー」をロック。

515

「写真１レイヤー」のロックを解除、３０１フレームに「空白キーフレームを挿入」。
メニューバーファイル→読み込みで「p09.jpg」を読み込む。
※読み込んだ画像が「写真２レイヤー」の画像に隠れて作業しにくいときは、「写真２レイヤー」をブラインド（"127"参照）にしてください。
メニューバー挿入→シンボルに変換で、名前を「p09」、タイプを「グラフィック」にして「OK」。
「情報パネル」で”ポイントが中心点”の状態で「X=160,Y=125」と入力（枠の中央に画像を配置します）。
「写真１レイヤー」をロック。
※「写真２レイヤー」をブラインドにしていたときは、（ロックのまま）ブラインドのみ解除。

516

再生ヘッドの位置で３０１フレームと３１４フレームの間をクリック（フレームが選択されていない状態で）、「F５キー」を２０回押し、「タイトルレイヤー」の３１５フレームが３３５フレームにくるまでフレームを延ばします。
「マスク２レイヤー」のロックを解除。
「マスク２レイヤー」 の３１０フレームと３２５フレームに「キーフレームを挿入」。
３２５フレームをクリックして、ステージの「マスク図形」が選択されているのを確認して、「情報パネル」で「W=10,H=10」と入力して「マスク図形」を縮小してください。
３１０フレームをクリック選択して「フレームパネル」で「モーショントゥイーン」を設定。
「マスク２レイヤー」をロック。
「写真２レイヤー」の３２６フレームに「空白キーフレームを挿入」して、以降「p08」の画像を削除してしまいます。

517

再生ヘッドの位置で３２６フレームと３３４フレームの間をクリック（フレームが選択されていない状態で）、「F５キー」を３５回押し、「タイトルレイヤー」の３３５フレームが３７０フレームにくるまでフレームを延ばします。
「写真２レイヤー」のロックを解除、３４０フレームに「空白キーフレームを挿入」。
メニューバーファイル→読み込みで「p10.jpg」を読み込む。
メニューバー挿入→シンボルに変換で、名前を「p10」、タイプを「グラフィック」にして「OK」。
「情報パネル」で”ポイントが中心点”の状態で「X=160,Y=125」と入力 （枠の中央に画像を配置）。
「写真２レイヤー」をロック。
「マスク２レイヤー」のロックを解除、「マスク２レイヤー」の３４０フレームと３５５フレームに「キーフレームを挿入」。
３５５フレームのステージの「マスク図形（W=10,H=10）」が選択さているのを確認して、「情報パネル」で「W=280,H=210」と入力して元の枠の大きさに戻してください。
３４０フレームをクリック、「フレームパネル」で「トゥイーン」を「モーション」、「回転」を「時計回り」、「回数」を「１」と設定してください。
「マスク２レイヤー」をロック。
メニューバー制御→ムービープレビュー（１００％表示）で確認し、フレームの長さ等を微調整してください。
完成すれば、これを「上書き保存」してください。

518

以上、 ここまでの制作ファイル 「test01.fla」です。
ファイル名を右クリックして「対象をファイルに保存」で取り込んで参考にしてください。

サンプルでは「マスク」及び「マスクの対象」として、「マスク２」「写真２」の組み合わせだけで作成しましたが、「写真１レイヤー」の上に「マスクレイヤー」を追加して、「写真１」「マスク１」の組み合わせと併せて利用することもできます。

　５−２　ホームページにアップする（パブリッシュ）

521

さて、ムービーが完成すればこれをホームページにアップして、いろいろな方に見ていただかないといけません(*^-^*)
FLASHムービーをホームページで見ることができるようにするためには、ムービー再生専用の「ｓｗｆファイル」というものと、それを埋め込むための、おなじみ「HTMLファイル」の２つが必要です。
丁度、写真画像を見てもらうために「JPGファイル」と、それを埋め込む「HTMLファイル」が必要なのと同じです。

「JPGファイル」や「GIFファイル」の場合、これを「HTMLファイル」に埋め込むタグは・・・
　　　<img src="（パス）/***.jpg" width=200 height=200>
このように記載しますね！

「SWFファイル」の場合のタグは・・・
　　　<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
　 　　　codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"
　　　　 width=450 height=250>
　　　　 　<param name=movie value="test01.swf">
　　　　　 <param name=quality value=high>
　　　　　 <param name=bgcolor value=#000000>
　　　　　 <embed src="test01.swf" quality=high bgcolor=#000000 width=450 height=250
　　　　　　　 type="application/x-shockwave-flash"
　　　　　　　pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">
　　　　　 </embed>
　　　 </object>
これは、サンプルムービー「test01.swf」に使っているタグですが、例えばこのような感じになります(◎-◎;
あまりの長さに驚かれたかも知れませんが、これから方法をご説明しますので、ここでは眺めるだけで結構です（笑）
要するに、FLASHムービーをホームページで見るためには、別に再生専用の「swfファイル」が必要ということと、それを「HTMLファイル」に埋め込むために、普通の画像をページに配置するのと同じ要領で、「<img src=〜>」の代わりに少々長いですが上記のようなタグをムービーを配置したい位置に貼り付け（書き込む）ればよいということです。

522

これまでLessonの中で扱ってきたファイルは、拡張子が「.fla」となっていてこれを「flaファイル」といいます。
「flaファイル」は、あくまでFLASHソフトでムービーを制作したり内容を修正するためだけのファイルです。
これをHTMLファイルに埋め込んでも何も見えません！

制作作業中にメニューバー制御→ムービープレビューをクリックしたときにムービーが再生されますが、実はこのとき、ソフト内部で自動的に「swfファイル」を作成し、それを再生しているのです。
Windowsの「エクスプローラ」で「test01.fla」を保存している「FlashFilesフォルダ」の中をみると、同じファイル名で拡張子だけが「.swf」の「test01.swf」が新たに出来ているのが確認できます。
これが再生専用の「swfファイル」です。

523

「swfファイル」を作成する方法は、メニューバーファイル→パブリッシュプレビュー→デフォルト（又はHTML）でも作成できます。
これを実行すると、ブラウザが自動的に起動し、HTMLファイルに埋め込まれた状態でプレビューされますので、それがそのままホームページで見える見え方です。
したがって、最終的には、必ずこの方法で確認されることをお勧めします。
そして、このときもソフト内部では「flaファイル」に基づいて、自動的に「swfファイル」を作成するとともに、ブラウザで見るために「HTMLファイル」も作成されているのです。
同様にWindowsの「エクスプローラ」で「test01.fla」を保存している「FlashFilesフォルダ」の中をみると、「test01.swf」の他にも、新たに同じファイル名の「test01.html」が出来ているのが確認できます。
※作成された「HTMLファイル」の拡張子は、デフォルト（初期状態）では「.html(エルが付いている)」ので、もしこのファイルをそのまま利用するときは、拡張子に注意してください。

524

さて、上記”523”で「HTMLファイル」に埋め込まれた「swfファイル」をブラウザで再生しているということは、その「HTMLファイル」の中に記載されているタグが確認できるということです。
ブラウザで再生している状態で、ブラウザのメニューバー表示→ソースをクリック。
「メモ帳」の新しい（別）ウインドウが開いて「test01.html」の「ソース（タグ）」が表示されます。
目を皿にしてよく見ていただくと、その中に上記”521”のようなタグが含まれているのが確認できます。
再生専用の「test01.swf」を埋め込むのに必要なタグは、上記の「<object>〜</object>」だけですから、この部分をドラッグ反転（選択）して、右クリック、ショートカットメニューの「コピー」をクリック。
実際にアップするHTMLファイルの中に「貼り付け」てください。
FLASH埋め込みタグの記載の仕方は、とりあえずこれが簡単で確実な方法かと思います。

525

実際にホームページとしてアップするHTMLファイルは、通常は別のフォルダにありますから、対象となる「swfファイル」も同じフォルダにコピー保存してください。
※「flaファイル」は、再生には無関係ですから、その必要はありません。

526

ホームページ用のファイルの動作確認や他のファイルとのリンク等を設定して、OKならあとは、「HTMLファイル」「swfファイル」とも確実にサーバにアップするだけです。

527

「ホームページにアップする（パブリッシュ）」の説明は以上ですが・・・
それにしても・・・FLASHムービーの埋め込みタグは長過ぎます（笑）
ホームページ本体ならまだしも、個々、親しい方に掲示板で見ていただきたいときに、こんなに長いタグでは簡単に貼り付けることができませんね(^^g/~~
実は、すべてがすべて必要とは限らないので、以下余談になるかも知れませんが、それぞれのタグの意味について少しだけ説明しておきます。

528

まずこのタグは、２種類のタグで構成されています。
ひとつは<object>タグ、もうひとつは<embed>タグです。
<object>タグは、「ActiveX」がインストールされているブラウザに対してのみ有効なタグです。
<embed>タグは、FLASHプレイヤーがインストールされているブラウザならIEでもネットスケープでも有効です。
これらのタグの使用を禁じている掲示板に対しては、勿論FLASHムービーを貼り付けることはできませんが、使用を許可されている場合は、両方記載する必要は無く<embed>タグだけで十分目的を達成できます。
中には、<embed>タグを禁じ、<object>タグを許可している掲示板もあります。
その場合は<object>タグだけを使って記載することになりますが、「ActiveX」がインストールされていないブラウザでは、ムービーが表示されません！
「ActiveX」はIEでは標準でインストールされているようですが、ネットスケープではどうもそうではないらしく、<object>タグだけで記載したときにはネットスケープでは表示されないようです！？（この辺のところはよくわかりません）

529

次にいずれのタグにも、よく見ると「http://〜」の記述に続いて、「macromedia.com」のどこかのページへのリンク記載があります。
これは、もし、閲覧されているブラウザにFLASHプレイヤーがインストールされていない場合、自動的に「macromedia.com」 のダウンロードページに繋がり、FLASHプレイヤーのインストールを促す画面がでるようにするためのものです。
ここで「インストール条件」を読んで「同意する」をクリックすると、最新のプレイヤーがインストールされます。
したがって、既に最新のプレイヤーがインストールされているブラウザに対しては必要のないものです。

530

それを取り除くと、どちらもタグ自体が非常にシンプルなものになりますね！
それぞれ別々に改めて記載しますと・・・

　　　<embed src="test01.swf" quality=high bgcolor=#000000 width=450 height=250>
　　-----------------------------------------------------------------------
　　　 <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width=450 height=250>
　　　　 　<param name=movie value="test01..swf">
　　　　　 <param name=quality value=high>
　　　　　 <param name=bgcolor value=#000000>
　　　 </object>

ここで、赤字＝ファイル名、青字＝ムービーの大きさ、緑字＝ムービーの背景色、茶字＝画質です。

531

トップページにFLASHムービーを配置して、そこに上記”521”のようにインストール用のタグも含めたタグを記載しておくと、FLASHプレイヤーがインストールされていない場合はその段階でインストールされるはずですから、次ページ以降のタグは、”530”のような簡略したタグを使用してもそれほど問題はないと思います。
※それも<embed>タグのみでも可能です。

掲示板も普通は、親しい方の場合が多いのでFLASHプレイヤーがインストールされていることを前提に、簡略化したタグを貼ることができますね！
掲示板に貼り付けるときの注意点としては・・・
ひとつは、貼り付けるサーバが他人のサーバですから、JPGファイルやGIFファイルを貼り付けるのと同様、ファイルのパスを「http://〜」からはじまる絶対パスで記載する必要があります。

　　　<embed src="http://hfm-kenchan.cpm/Lesson/test01.swf" quality=high bgcolor=#000000 width=450 height=250>

もうひとつは、掲示板の投稿欄が「自動改行」になっている場合（ほとんどそうですが）、改行されたタグをそのまま貼り付けると当然その部分に自動的に＜BR＞タグが挿入されます。
<embed>タグの場合は一行で記載されているので問題ありませんが、”530”の<object>タグをそのまま投稿欄に貼り付けると、記事欄に記載されるタグは・・・

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width=450 height=250><br><param name=movie value="test01..swf"><br><param name=quality value=high><br>・・・

このようになり、場合によってはレイアウトが変形したり誤作動の原因になります。
それを防ぐために・・・

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width=450 height=250><param name=movie value="http://hfm-kenchan.cpm/Lesson/test01.swf"><param name=quality value=high><param name=bgcolor value=#000000></object>

タグとタグの間を詰めて「<object>〜</object>」 を一行で書き込んでください。

　５−３　単独で動くムービークリップ

532

サンプルムービーでは使用しませんでしたが、FLASHを扱う上で非常に便利で重要なオブジェクトがあります。
これまで学んできたのは、「シーン（元のムービー）」のタイムライン上で、文字や図形、ボタンなどのオブジェクトを動かしていました。
フレームアクションの”Stop();”でタイムラインを止めると、すべてのオブジェクトが止まり、 ”Play();”で一斉に動きだすというものでした。
ここに、このタイムラインとは独立して、独自のタイムラインをもったオブジェクトがあれば、さらにムービーの表現が広がります。
それが「ムービークリップ」というものです。
つまり「ムービークリップ」とは、FLASHムービーの中にあるFLASHムービーと考えることもできます。

533

これも、実際に作成してみて実感していただければ、その意味が理解できると思います。

�@FLASHソフトのメニューバーファイル→新規作成で、新しくファイルを作ります。
�Aメニューバーファイル→名前を付けて保存をクリックして、名前を「test03.fla」として「FlashFiles」フォルダに保存。
�Bメニューバー修正→ムービーで、サイズを「５００×２００」にします。
�Cステージの左下に、Lesson１でやったように「球体」を描いてください。

「ムービークリップ」も「グラフィック」や「ボタン」と同じ「シンボル」のタイプのひとつですから、図形や文字を「ムービークリップ」にする方法も同じです。

�D「球体」を選択した状態で、メニューバー挿入→シンボルに変換をクリック。
�E「シンボルプロパティ」 で名前をここでは例えば「ボールM」とし、タイプを「ムービークリップ」のままにして「OK」をクリック。

ステージの「球体（インスタンス）」は見た目には「グラフィック」と区別が付きませんが、「インスタンスパネル」を見ると、図のようにそれが「ボールM」という名前の「ムービークリップ」ということが分かります。
また「ライブラリ」にも「”ボールM”ムービークリップ（シンボル）」が登録されています。

534

ステージの「ボールM」ムービークリップを右クリックして「同じ位置で編集」をクリックすると、これまでのシーン編集画面から下図、右のような「”ボールM”ムービークリップ」の編集画面に変わります。



「ムービークリップ編集画面」では、シーン編集画面と全く同じように編集することができます。
※全く同じということは、「ムービークリップ」の中に「グラフィック」や「ボタン」、さらに別の「ムービークリック」なども自由に配置し、フレームアクションも含めて編集できるということです。

ここでは、例題としてボールを上下に垂直移動させ、それに伴って影が移動するようなムービークリップを作ってみます。
�@ まず、編集しやすいように「レイヤー１」の名前を「ボール」に変更し、影用のレイヤーを追加して、それを「影」としてください。
�Aステージの「球体」を選択して、メニューバー挿入→シンボルに変換で、名前を「ボール」、タイプを「グラフィック」とします。
※当初のシーン画面からこの「ボールM」を見たときは、「ムービークリップ」ですが、「ムービークリップ編集画面」の中では、普通の球体図形です。
普通の図形のままでは「モーショントゥイーン」が設定できないので、改めてこれを「グラフィックシンボル」にして、ステージの球体をそのインスタンスに置き換ます。
�B同様に「影」レイヤーにも影図形を描き、それを「グラフィックシンボル」に変換します。
�C「ボールレイヤー」及び「影レイヤー」とも、１０フレーム及び２０フレームに「キーフレームを挿入」 。
�D１０フレームで「ボール」を真上に移動、「影」 も適当に斜め右上方向に移動して「効果パネル」で「アルファ２０％」程度に設定してください。
�E各キーフレーム間に「フレームパネル」で「モーショントゥイーン」を設定します。
その際、ボールの上下動に加速度を付けることによって、弾む感じを出してみましょう。
加速度は左図の「イージング」で設定します。
数値が「プラス」のときは、最初速く、徐々に遅くなる「減速」。
「マイナス」のときは、最初遅く、徐々に速くなる「加速」。
値の大きさはその度合いです。
ボールが上昇するときは減速、落下するときは加速になりますから、１フレームでは「ボール」「影」ともに「１００」に設定、１０フレームでは共に「−１００」に設定してください。



�Fメニューバー制御→ムービープレビューで動きを確認してみてください。 着地の部分が不自然です(^^g/~~
よく見るとこれは、１フレームと２０フレームのボール及び影が同じ位置にあるためです。
そこで、両方とも１９フレームに「キーフレームを挿入」、２０フレームを削除することで修正します。
�G「”ボールM”ムービークリップ」の編集が終われば、ムービークリップ編集画面の左上「シーン１」をクリックして、元の「シーン編集画面」に戻ってください。

535

さて「シーン編集画面」では、「レイヤー１」に１フレームがあるだけで、そこに今編集した「”ボールM”ムービークリップ」が配置されています。
これが「グラフィック」や「ボタン」であれば、タイムラインが１フレームだけですから動きようがありませんでしたね！
改めて、メニューバー制御→ムービープレビューで、ムービーの動きを確認してください。
「シーン（元のムービー）」のタイムラインにかかわらず、ムービークリップのタイムラインが単独で動いています！！

タイムラインの関係をもう少し実感していただくために、今度は「シーン」 のタイムライン上で「ムービークリップ」の位置を変化させてみましょう。
�@ステージの「ボールM」をさらに左に移動して、ムービーの外側に配置。
�A１００フレームに「キーフレームを挿入」、１００フレームの「ボールM」をムービーの右端に水平移動させて配置してください。
�B１フレームに「モーショントゥイーン」を設定します。
「再生ヘッド」を左右に移動すれば「ボールM」が左右に動くのが確認できます。

「シーン」のタイムラインをコントロールする「ボタン」を作ります。
�Cレイヤーを追加して、名前を「ボタン」としてください。
�Dメニューバーウインドウ→サンプルライブラリー→ボタンで「ライブラリ−ボタン.fla」を開き、そこの「（rectangle）Button Set」フォルダを右クリックして「フォルダを開く」をクリック。
「Gray Button-Pause」と「Gray Button-Play」をステージにドラッグしてください。
�E「Gray Button-Pause」 を右クリックして「アクション」をクリック。
「アクションパネル」の左窓「ツールボックスリスト」から「Stop」をダブルクリックして、右の「スクリプトエリア」に、
　　　on (release) {
　　　　　stop ();
　　　}
と書きだしてください。（Lesson４”417,418”参照）
※ボタンがクリックされたら、タイムラインを止めるの意味。
�F同様に「Gray Button-Play」 に、
　　　on (release) {
　　　　　play ();
　　　}
と書きだしてください。
※ボタンがクリックされたら、タイムラインを動かすの意味。

536

メニューバー制御→ムービープレビュー、又はメニューバーファイル→パブリッシュプレビュー→デフォルト（又はHTML）で動きを確認してください。

537

以上は、「ムービークリップ」の活用方法のひとつに過ぎません！！
「ムービークリップ」の中に「ボタン」を配置したり、「ボタン」の中に「ムービークリップ」を配置したり、「ムービークリップ」中にさらに「ムービークリップ」を配置したりと、自由自在に活用できます。
また、「ムービークリップのインスタンス」に固有の名前を付けることで、ムービークリップの内外から、インスタンスの固有の名前を指定して、個別にアクションコントロールするようなことも可能です。
ネット上で見かける不思議な動作をするムービーは、すべてこの「ムービークリップ」を駆使しているといっても過言ではありません。
残念ながらこの講座では、そこまで踏み込んで解説することはできませんが、個別の事例や疑問点などございましたら、いつでも「Q&A掲示板」でお尋ねください！
憲ちゃんもご一緒に勉強しながら、わかる範囲でお答えできるよう努力させていただきます(*^-^*)

【おしえて！ＦＬＡＳＨ５】お奨め関連ページ
○「３−１　パブリッシュする」 …Ｐ４８〜４９
○「３−４　割り付けタグ実験室」…Ｐ５４〜５５
○「４−３　マスクで切り抜き！場面転換」…Ｐ７２〜７３
○「５−５　ムービークリップは止まらない！」…Ｐ９２〜９３
○「12−１　ムービークリップでアニメるボタン」…Ｐ２０２〜２０３
○「12−３　ムービークリップを外からコントロール！」…Ｐ２０６〜２０７
○「12−５　ムービークリップの階層化」…Ｐ２１０〜２１１