| Name |
マー
|
| Date |
2004年11月08日 (月) 16時45分 |
| Message |
初めまして。
http://naturalbreeze.cside.com/
上記のmenu08のようなものを作ってみようと思いましたが、
どんなアニメーション、スクリプトか、思いつきません。
検索で探していくうちこのＨＰを見つけました。
サンプル作品のうちNo233の可動メニューが似ていましたが、
メニューが透明で背景が写真のスライドショーです。
どうすればこのようなメニューが出来るのでしょうか？
日時も自動的に表示していますが、どんなアクションスクリプトでしょうか？
よろしくお願いします。
※ファイルサンプルがいっぱい載ってて、しかも親切にアドバイスをする、このＨＰは最高です。毎日拝見しています。 |
Response
01
|
| 2004年11月09日
(火) 02時19分＞ 憲ちゃん
|
|
はじめまして、マーさん♪
button32.fla
右図の上がサンプルのシーン編集画面です。
「メニューセット」レイヤーに「メニューセット」MCを配置、その中に図下のような構造の
「メニュー１」〜「メニュー８」までのMCを並べて配置しています。
それぞれインスタンス名として上から順に「mc1」〜「mc8」と別途「横線」だけのMCに「mc9」と
付けています。
各メニューMCの中の「ボタンMC」レイヤーには・・・
中身が四角図形のボタンをさらにムービークリップで包んだ「ボタンMC」MCが配置されています。
このボタンのアップフレームの図形はアルファ０％、オーバーフレームはそのままです。
このボタンにボタンアクションで・・・
on (rollOver) { ボタンにマウスが乗ったら
_root.menu = _parent._name；←_root（シーン上）の変数menuに自分のひとつ上の階層のMCの
} インスタンス名を代入（ここでは「mc1」〜「mc8」のこと）
on (rollOut) { ボタンからマウスがはずれたら
_root.menu = ""；←_rootにある変数menuを空にする
}
on (release) { クリックされたら
クリックした結果の処理 ⇒この部分の＜関連記事＞
}
そして、これを包む「ボタンMC」のクリップアクションで・・・
onClipEvent (enterFrame) { フレームレートごとに以下を繰り返し実行
if (_root.menu == _parent._name) { menuの値と上の階層のインスタンス名と同じなら
this._alpha += (_root.bgAlpha - this._alpha)/6；←透明度を徐々に目標値に近づける
this._height += (_root.openH - this._height)/6；←自分の高さを最大目標値に・・
if (this._height > _root.open-5) { 自分の高さが目標値-５より大きくなったら
_parent.gotoAndStop(2)；←ひとつ上の階層のタイムラインを２フレームに移動
} 下の図、メニュー編集画面…「コメント」表示
} else { そうでない（インスタンス名が異なる）なら
this._alpha = 100；←透明度を100％に戻し
_parent.gotoAndStop(1)；ひとつ上の階層で１フレームに移動（コメントを隠す）
this._height += (_root.closeH - this._height)/6；←高さを元の高さに徐々に戻す
}
}
各メニューの中のボタンにマウスが乗ったとき、それを包むMCが高さを変化させて大きくなることで、
その中のボタンも大きくなります。外れると元の大きさに戻る仕組みです。
同時にこれは、それを包むMC（「mc1」〜「mc8」）もそれぞれ高さを変化させることにもなるので・
これらを包む「メニューセットMC」で、それぞれの位置関係を決定させます。
それを行っているのが「メニューセットMC」のクリップアクション・・・
onClipEvent (enterFrame) {
mc2._y = mc1._y + mc1._height；
mc3._y = mc2._y + mc2._height；
mc4._y = mc3._y + mc3._height；
mc5._y = mc4._y + mc4._height；
mc6._y = mc5._y + mc5._height；
mc7._y = mc6._y + mc6._height；
mc8._y = mc7._y + mc7._height；
mc9._y = mc8._y + mc8._height；
}
以上が要点ですが、詳細はflaファイルを分析して研究してみてください。
＜参考＞
■プルダウンメニューで重なった下のボタンが影響してしまいます？
■オンマウスで連動する可変ナビゲーション(２)
次の「月日」レイヤーでは「月日」MCを配置、そこで現在月日を取得して表示しています。
これについて基礎的なことは■デジタル時計などを参考にしてみてください。
その下「BGループ」レイヤーに「BGループ」MCを配置して、MC内で画像をループさせています。
■背景画像の無限ループについて…
それぞれ方法はこれだけに限りませんが、要はボタンそのものにアルファ（透明度）をつけて、
背景が透けて見えるようにすればよいわけですね(*^.^*)
マーさんご自身で分析してみて分からないところは改めてお尋ねください！！
|
|
Response
02
|
| 2004年11月09日
(火) 21時09分＞ 憲ちゃん
|
|
”背景が外部で繋がる”というのは、このサンプルのことでお尋ねですか？
そうだとしたら、スクリプトは一切使っていません(^^;
「BGループ」レイヤーの２フレームにある「BGループ」MCをステージでダブルクリックして、
その編集画面をみていただければ一目瞭然…モーショントゥイーンで移動させ、
タイムラインの中でぐるぐる無限ループさせているだけです。
メニューやコメントも、スクリプトは使っていません。
文字ツールで、サンプルではメニューは静止テキスト、コメントはダイナミックテキストで
たまたま記載しています。
これは用途や好みの問題ですからどちらがどうということではありません(*^.^*)
|
|
Response
03
|
| 2004年11月11日
(木) 10時49分＞ 憲ちゃん
|
|
外部のJPEGファイルを読み込むのは「MCインスタンス名．loadMovie("JPEGファイル名")；」です。
これをBG画像に相当するシンボルを「空のムービークリップ」にして適用します。
外部テキストを読み込むのは「「MCインスタンス名．loadVariables("TXTファイル名")；」です。
MENU文字、コメント文字の部分を「ダイナミックステキスト」にして、
そこに対応する文字列を表示させることができます。
具体的にどのような構造でどのようなスクリプトを記載するかは、
マーさんがどのような目的でどのように表示したいかによってバリエーションは様々です。
おっしゃるように、外部JPEGファイルの読み込みの目的が、最初の再生を軽くするために、
ｓｗｆ容量を軽くしたいとお考えなら、そんなことはしないほうがいいのです（笑）
外部ファイルも内部ファイルも読み込み速度は同じでそれによって速くなることはなく、
むしろ内部ファイルにすることで、上手く利用すれば「先読み効果」が働いて速く表示されます。
なお、ｓｗｆファイルの全体容量と再生の重い軽いは直接関係ありません！
詳しくは過去記事の■ＳＷＦファイルの容量はどれぐらいが妥当か？を参照してください。
ご紹介のサイトは、Flashソフトをお持ちでないユーザーでも素材を活用できるように、
外部ファイルと外部テキストだけをカスタマイズすればいいようにしたものと思います。
マーさんの目的もそうですか？(^^;
そうであれば、また別投稿で再度ご質問ください♪
|
|
Response
04
|
| 2004年11月12日
(金) 12時06分＞ SeeDa!!
|
|
MX2004なら、duplicateMovieClipで複製すれば良さそうですが…
それ以前なら、同じ画像を２度読み込んで
imgbox1_mc.loadMovie("hogehoge.jpg");
imgbox2_mc.loadMovie("hogehoge.jpg");
どちらか一方を反転
imgbox2_mc._xscale = -100;
してみてはいかがですか？
|
|
Response
05
|
| 2004年11月12日
(金) 14時29分＞ 憲ちゃん
|
|
SeeDa!!さん、いつもありがとうございます(*^.^*)
「duplicateMovieClip（）」はFlash５にもあり、確かにMCの複製を作成しますが、
レイヤーの重なり順とは次元の異なる、はるか上層の再生空間に複製され再生されます。
「attachMovie()」同様「深度」という概念で表現される空間です。
したがって、これを使うとメニューなどのレイヤー上のオブジェクト（部品）の上にかぶさって、
複製した背景だけが最前面に出てしまいます（笑）
後者の利用がベターと思います♪
そしてマーさん♪
Flashをツールとして活用するには、スクリプトがあるのかどうかを探す前に・・・
基本に戻って、方法を探るほうが現実的です（笑）
＜参考＞■アクションスクリプト講座第１回：はじめに
「アクションスクリプトはFLASHアニメの補完」
上記サンプルと同じ内容のことを外部JPEGファイルの読み込みで行うには・・・
背景写真を入れた「BG画像」の中に読み込みますから、これをグラフィックではなく、
「ムービークリップ」で作成します。
読み込まれる画像は、このムービークリップの基準点を左上として読み込まれますから、
作成手順としては、まずダミーとして画像の大きさに相当する四角の図形を描きます。
メニューバー「挿入」→「シンボルに変換」で、名前を仮に「ダミー画像」、
タイプを「ムービークリップ」、基準点を「左上」にして「OK」をクリックします。
ステージの「ダミー画像」MCをダブルクリックして編集画面をだし、レイヤーを追加して、
そこに「this.loadMovie("bg.jpg")；」と記載します。（SeeDa!!さんの後者に該当します）
ダミーの四角図形は、実際に画像が読み込まれると消滅し、画像に置き換わります。
何のためにこれを描いたかというと・・・
次の「BGセット」MCに正確に配置するための目安で、編集上の理由です。
ステージで「ダミー画像」MCを右クリックで「コピー」、ステージの何もない場所で再度右クリック、
「同じ位置にペースト」をクリックして、複製を２枚作成。
内１枚をメニューバー「修正」→「変形」→「横反転」し、図のように３枚並べます。
これを束ねて「BGセット」MCに変換します。
あとは前回同様、これを「BGループ」MCの中でモーショントゥイーンで回転させます。
どうしても、この回転をアクションスクリプトで行いたいということでしたら・・・
「BGループ」MCを無しにして、いきなりシーンの「BGループ」レイヤーに、
「BGセット」MCを配置、そのクリップアクションで・・・
onClipEvent (load) {
speed = 2；
}
onClipEvent (enterFrame) {
this._x -= speed；
if (this._x < -(this._width*2/3)) {
this._x = -speed；
}
}
一例としてこんなことになります(*^.^*)
button33.fla ※MX仕様 bg.jpg
サンプルは、アクションスクリプトでループさせたものです。
これはこれとして・・・
憲ちゃんが「定期的に背景を変える」なら、このような方法ではなく・・
最初のムービーを使って、そこの「ライブラリ」を開き、
このようにするだけで、背景画像だけが入れ替わります。
これをパブリッシュし、更新されたｓｗｆファイルを上書きアップします。
ご参考までに・・・(*^.^*)
|
|
