背景画像をを継ぎ目無く無限スクロールさせる方法

つい最近Flashの勉強を始めた者ですm(__)m

当面の目標として、背景画像として使っている空の画像を、雲が流れているような感じて左から右へ自動スクロールさせたいのですが、継ぎ目無く自然に無限スクロールさせるためには、どの様にするのがわかりやすい方法でしょうか？

モーショントゥイーンでは中々うまくいかないのですが、継ぎ目無く自然に無限スクロールさせるためにはアクションスプリクトを使わなければ無理なのでしょうか？

ステージのサイズは300～500px程度、スクロールさせる空のjpg画像のサイズはフォトショップで調整出来ます。


やり方がわかる方、アドバイス頂ければ大変助かります。どうかお知恵をお貸し下さい。よろしくお願い申し上げますm(__)m

No.1 回答者： sassakun 回答日時： 2005/03/11 04:18

Flashの機能というより，まず雲画像の左辺に雲画像の右辺をつなげたとき

ちゃんと継ぎ目がなくて，ちゃんとループする画像かどうかが問題です。
（↑HTMLの背景に使ったとき，左右には無限につながるような画像）

ちゃんとつながるような雲画像であった場合，複雑に考えず，単なるアニメーションでできます。
使うスクリプトは「gotoAndPlay();」というフレームアクションだけです。

□←ステージ　■←雲画像　　として

..□
■■
　↓
..□
.■■
　↓
..□
..■■　gotoAndPlay(1);

雲画像がステージと同じか，大きかった場合は，おおまかにはこんな感じです。
gotoAndPlay(1);をしたときに一瞬画像が止まったようにみえたり，
時間的にズレる場合は，gotoAndPlay(2);にするとか，gotoAndPlay(1);するときの雲の位置を左右に調節するとかしてください。

雲以外，何も登場しないアニメーションであれば，これでOKです。
でも，たぶんそんなことはないと思います。
だから，ふつうはこのアニメーションをムービークリップの中に作り，背景として配置しておいて，その前で別のオブジェクトを上のレイヤーで動かします。

雲画像をぴったり左右に合わせるには，グリッドに吸着や，線に吸着を使ってうまくつなぎ合わせてください。
ちなみに雲画像はオブジェクトにしておいて，すべて別レイヤーで動かしてください。

この回答へのお礼

詳細なご説明ありがとうございます！


雲画像を継ぎ目無くつなげるために、雲画像をコピーして２枚にし、一枚を左右反転させた物をくっつける事でなんとか対処しています。

ちなみに今日自分で考えたやり方は、雲画像を普通にモーショントゥイーンでステージの右端まで流し、また左端にループする瞬間の違和感を目立たなくするために、、ムービーの最初と最後にフェードイン・フェードアウトを入れるとか、または雲と同じ色の別レイヤーを作り、雲画像が右端から左端にループする時にに自然にかぶせてごまかす、という物です。どっちがいいかな？というより、的はずれ、ですね（＾＾；

さっそく今夜、sassakunさんからお教え頂いたとおり、挑戦してみます。ちなみに「gotoAndPlay(1);」のカッコ内の数字の役割は何なのでしょう？数字を変更したらどんな変化があるか試してみます。

書き忘れていましたが、FlashMX2004を使っています。

どうもありがとうございました（＾＾

お礼日時：2005/03/11 18:49

No.2 回答者： sassakun 回答日時： 2005/03/11 20:59

>> 「gotoAndPlay(1);」のカッコ内の数字の役割は何なのでしょう？数字を変更したらどんな変化があるか試してみます。

雲に限らず，「gotoAndPlay(○○);」は最初の１歩だと思います。○○は普通，数字を入れて，フレームナンバーを示します。
もっとなれてくれば変数名でも良いです。

スクリプトの小技をコピペするより，ちゃんとアニメーションができること。
それが一番にたいせつなことで，次にStopとかgotoという基本的スクリプトが必要です。
最もイラレとかでベクトル系の作図をされていたら問題がないと思いますが，アニメーションの前にまず作図かもしれません。

雲に関してですが，

Design Pocket TaMaGoさん(http://namatamago.com/)が良い感じの雲の流れのサンプルを紹介してくれています。
http://flash.namatamago.com/lesson/lesson_middle …
もし，自分でそれなりにできた場合(できた場合です)
参考にされれば色んな表現方法が見つかるかもしれません。

マスクとかスクリプトとか色々使われていますが，基本が出来た上で参考にされるのは良いと思います。

参考URL：http://flash.namatamago.com/lesson/lesson_middle …

この回答へのお礼

sassakuさま、続いてありがとうございます。

Design Pocket TaMaGoさんというサイト、知りませんでした。大変勉強になるサイトですね。教えて頂いてありがとうございました。


教えて頂いた「gotoAndPlay(1);」を使っていろいろ試してみているのですが、なかなかうまくいかないです・・


40フレームで左端から右端まで雲が流れるアニメーションをモーショントゥイーンで作っているのですが、アクションスプリクト記述用の別レイヤーを
作ってアニメーションの最後のフレームである40フレーム目に「gotoAndPlay(1);」を入れてみたのですが何も変わらないみたいです・・

ちなみに、「gotoAndPlay(1);」のかわりに「stop();」を入れてみたら、アニメーションがループしないで、ちゃんと一回の再生で止まります。


「gotoAndPlay(1);」を記述するフレームの位置とか記述するレイヤー、()に指定するフレームの番号などを間違っているのでしょうか？


とりあえず、いろいろ試してみます。

お礼日時：2005/03/12 15:33

No.3 ベストアンサー 回答者： sassakun 回答日時： 2005/03/12 18:42

>> 教えて頂いた「gotoAndPlay(1);」を使っていろいろ試してみているのですが、なかなかうまくいかないです・・

使っているスクリプトはgotoAndPlay();のみ。
まずメインのアニメーションの最終フレームに「gotoAndPlay(81);」，
雲のムービークリップの中に「gotoAndPlay(1);」。
それだけです。
アニメーションも単純なモーショントゥイーンのみです。

この回答への補足

すみません、下記のお礼を書き込んだ約２０分後に、やっと出来ました！
（雲の画像は適当ですが・・）

雲画像はメインのタイムラインではなく、シンボル内のタイムラインでアニメーションしていたのですね。

最初と最後のフレーム（1と160）以外に、29、80、103フレームをキーフレームにする意味はイマイチわからないですが・・

雲画像のシンボル内の、レイヤーで分けた雲画像の並べ方、非常に勉強になりました。雲が流れるFlashにあこがれ私は最近Flashを勉強し始めたので、第一段階の目標がクリア出来てすごくうれしいです。

sassakunさまのサンプルflaファイルが完璧に理解できるまで、もうちょっと頑張ってみますね！

補足日時：2005/03/13 02:34

この回答へのお礼

sassakunさま、本当にありがとうございますm(__)m

お礼日時：2005/03/12 23:35