この講座は,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は全てのインスタンスに共通の場所なので、お互いにクリックされた番号を認識しあえる。
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
このサイトで使用しましたflashソフトはflash mx 2004年版(Flash Japan)- flash8 及び FlashCS3-2007年版です。 flash講座(フラッシュ講座)は、Yoshioka氏(通称、ひげ親父)による制作です。 コツコツと作られたflash素材(flashアニメ、スクリプト)はユーザーの方により保存変更され動画flash(動画フラッシュ)や携帯flash(待受flash)として利用されて来ました。
 氏は、flashスクリプトについての学習を、パソコン塾講師活躍中に始められ、独立した今も続けておられます。  macromedia flashソフトは新しくadobe flash時代に入りましたので、これを機会にflash学習サイトを「flash講座1234」としてリニューアルいたしました。 引き続きご愛顧承りますよう、よろしくお願いいたします。                                                                            (by Hiraoka)
HOME   Flash講座総リスト    アクションスクリプトの実践的事始め-活用編(8)