この講座は,flashソフトを用いてflashアニメをスクリプトで制作し無料で公開したものです。![]() |
||
| FLASH講座 ーアクションスクリプトの実践的事始めー 活用編 (7)移動・拡大型フォトギャラリー (外部asファイル・クラスの使用) 花 |
||
| 今回のフォトギャラリーは、サムネイルをクリックするとスクリーンにその大きさのまま移動し、次いでスクリーンの大きさに拡大するというものですが、これを配列を使わないスクリプトで作成しました(クラス使用)。 これまで、この種のスクリプトは配列を使って作成してきました。 しかし配列を使ったスクリプトは、リーダーが全員の行動を眺めながら管理するような感じで書いていきます。 それに対し、今回の書き方で作成するのは、行動する人の身になって書いていくような感じです。 したがって、何をするかを自分のものだけ順番に書いていけばよいので、ある意味とても書きやすいのです。 しかし、自分のことだけでは片付かない場面もあります。 すなわち、他の人の行動を見て(この例の場合は、他のサムネイルがクリックされたとき)行動を起こさなければならないことがあります。 この、他の人の行動を感知する方法が結構面倒なのですが、今回は、共通の場(ルート)にFLAGを立てる方法を使ってみました。 |
||
| SAMPLE | ||
| ステージの準備 | ||
| 550×420、黒のステージに500×333(灰色#999999)のスクリーンとそれを囲むように10px幅の枠線(#996600)を描く。枠線をシンボルに変換した後、filter機能のベベルを施す(この例の場合は、ぼかし水平・垂直:5、強度:42%、画質:低、シャドウ:黒、ハイライト:白、角度:45、幅:5、タイプ:内側) 表示する写真(ここでは、8枚の花の写真、500×333)を新規シンボルとして読み込み(シリーズpl1からpl8)それぞれ同名でリンケージを設定する。 |
||
| スクリプト(ここでは全角スペースが入っているので、コピー・ペイストだけではエラーになります) | ||
| flaファイルに var pic_num:Number=8; for ( var i:Number=1; i<=pic_num; i++) { var gal:makeGal=new makeGal(i); } makeGal.asファイルに class makeGal extends MovieClip { private var pic_num:Number; private var x:Number; private var y:Number; private var delay:Number; private var flag:Number; public function makeGal(i:Number) { _root.attachMovie("pl"+i, "pic"+i, i); this = eval("pic"+i); this._x = 80+55*(i-1); this._y = 390; this._xscale = this._yscale=10; this.onRelease = function() { _root.flag = i; this.x = 100+300*Math.random(); this.y = 70+200*Math.random(); this.delay = getTimer(); } this.onEnterFrame = function() { if (_root.flag == i) { this._x += (this.x-this._x)/2; this._y += (this.y-this._y)/2; if (getTimer()>this.delay+1000) { this._x = 275; this._y = 186; this._width += (500-this._width)/3; this._height += (333-this._height)/3; } } else { this._x += (80+55*(i-1)-this._x)/2; this._y += (390-this._y)/2; this._width = 50; this._height = 33; } }; } } |
表示する写真の数の定義 makeGalというクラスを定義し、pic1からpic8までのインスタンス(写真)を作成、引数 i と数をasファイルに渡して、ファイル記述のイベントを実行させる。(注1) Geocitiesではasファイルはアップロードが拒否されます 拡張子をtxtとしてアップすると機能します makeGal クラスをMovieClipクラスを継承して宣言 (注2) 変数の定義 flaファイルから受け取った引数を使ってインスタンスの性質や動きを定義する関数(注3) 引数i ( i 番目)の写真をインスタンス としてステージに そのインスタンスをthisとして扱う 初期表示のx座標 初期表示のy座標 インスタンスのサイズを1/10に縮小(サムネイル) インスタンスがリリースされたら _root.flagを i とする(自分の番号) 移動先のx座標をランダムに発生 移動先のy座標をランダムに発生 フレームアクション(時間の経過とともに実行) もし、root.flagが i (自分の番号)だったら (注4) 移動先xに移動 移動先yに移動 もし、クリックされてから1秒経ったら、 スクリーンの真ん中を中心に スクリーンいっぱいのサイズに もし、_root.flag が自分以外の番号だったら (ほかのインスタンスがクリックされたら) 元の場所に戻る 元のサイズになって |
|
| (注1) asファイルにはインスタンス1つ分のイベント(クリックされたら大きくなって表示するという動き)しか書かれていない。そのような動きをするインスタンスを、表示する写真の数だけ作成する。 (注2)_x、_xscale、onEnterFrameなどMovieClipクラスで定義されているscriptを使うときは継承を宣言する (注3)コンストラクタ関数と呼ばれ、クラス名と同じ関数名としておく。インスタンスが作成されると引数つきで自動的に呼び出され、クラス(で定義されたインスタンス)のプロパティー、メソッドが定義されている。 平たく言うと、色や大きさなどの見た目とか、どこに出かけて何をするとかの行動の基本を書き記したもの(ちょっと乱暴か)。 (注4) _rootは全てのインスタンスに共通の場所なので、お互いにクリックされた番号を認識しあえる。 |
||
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - -
|
||
| HOME Flash講座総リスト アクションスクリプトの実践的事始め-活用編(8) | ||
![]()