この講座は,flashソフトを用いてflashアニメをスクリプトで制作し無料で公開したものです。
FLASH講座 ーアクションスクリプトの実践的事始めー
応用編
(6)波 紋
 
(外部ファイル・クラスの使用)
 今回のflash講座は、定番の波紋です。 通常、透明の波紋を描くときは、虫眼鏡の要領で倍率の違う写真を重ね合わせて、波紋をマスクにしてトゥイーンを掛ける方法を使います。しかしここでは、ver.8で使えるようになったフィルター機能のベベルを使って、盛り上がった波紋状の楕円を描き、これをかなり透明にしてトゥイーンを掛ける方法を試みます。
 
 なお、今回は、波紋の動きのクラスを外部ファイル(.as)で作成し、これをタイムラインで呼び出すスクリプトとしました。 クラスをわざわざ作るほどのプロジェクトではないのですが、こういう方式を勉強する手始めとしては丁度いい材料に思えます。 このflash講座から、後で見ても分かりやすいスクリプトを心がけて書く癖がつくといいですね。
 サンプル(写真は、http://danny.oz.au/travel/new-zealand/photos.html からの転載です)
ステージの設定・及び準備
(1)w500、h375のステージを設定する。
(2)背景となる写真(画像)をステージいっぱいに配置する。
(3)楕円ツールでステージに、w400、h100のドーナツを描く(幅は適当)。
    ドーナツの書き方:まず、縁無し塗りつぶし楕円を描く。中心を同じにして色を変えて小さめの楕円を重ねて描く。
                小さめの楕円のみを選択して削除する(オブジェクトの描画をoffにする)。
(4)ドーナツをシンボルに変換し、hamonと名づける。
(5)hamonを選択し、フィルターのメニュータブからベベルを選択し、以下の設定をする。
   タイプ:内側、ぼかし:水平、垂直ともに5、強度:100%、角度:45、幅:5、画質:低 (これらは好みで変えても可)
(6)ステージから波紋を削除する。
スクリプト(makeRipple.asファイル)
asファイルはswfファイルと同じディレクトリーに置くこと
class makeRipple extends MovieClip{

 private var default_ripplescale:Number;
 private var final_ripple_xscale:Number;
 private var final_ripple_yscale:Number;
 private var speed_scale:Number;
 private var speed_alpha:Number;

 function makeRipple(i) {

  var $hamon:String = "hamon"+i;
  _root.attachMovie("hamon", $hamon, i);
  this = eval($hamon);
  this._x = Stage.width/2;
  this._y = Stage.height*4/5;
  default_ripplescale=10;
  final_ripple_xscale=100;
  final_ripple_yscale=60;
  speed_scale=10;
  speed_alpha=50;
  this._xscale = this._yscale=default_ripplescale;
  this._alpha = 15;

  this.onEnterFrame = function() {
  this._xscale += (final_ripple_xscale-this._xscale)/speed_scale;
  this._yscale += (final_ripple_yscale-this._yscale)/speed_scale;
  this._alpha += (0-this._alpha)/speed_alpha;
  }
 }
}

MovieClipクラスを継承するmakeRippleクラス
以下各変数のタイプの定義
hamonの大きさ初期値
水平方向のhamon大きさの最終値
垂直方向の   〃       〃
波紋が大きくなるときの速度係数
アルファ値の変化の速度係数

関数makeRipple(引数)
 ここでは、波紋の数とhamonナンバー
hamon1,2,3,,,,の定義
ステージにインスタンスhamon1,2,3,,を生成
文字列のthisへの関連付け(変数として)
hamon中心点のx座標を画面中央に
hamon中心点のy座標を上から4/5に
hamonの初期の大きさ
hamon水平方向の最終大きさ
hamon垂直方向の最終大きさ
hamonが大きくなる速度
hamonが消えていく速度
大きさ初期値設定
アルファ値設定

フレームアクション
波紋が広がる

波紋がだんだん透明になり消える
スクリプト(FRAMEに)
swfファイルの、FRAME 1,6,11,33にキーフレームを挿入し各FRAMEに以下のスクリプトを書き込む
FRAME 1:
var hamon:makeRipple=new makeRipple(1);
FRAME 6:
var hamon:makeRipple=new makeRipple(2);
FRAME 11:
var hamon:makeRipple=new makeRipple(3);
FRAME 33:
var hamon:makeRipple=new makeRipple(4);
新しいmakeRipple(引数)を生成
i=1(hamon1)

i=2(hamon2)

i=3(hamon3)

i=4(hamon4)
 以上のように、外部ファイルに波紋が発生・拡大・消失するムービークリップをクラスmakeRippleとして作成・定義しておくと、タイムラインからそれを呼び出して、画面上に波紋のムビークリップを発生させることが出来る。
 なお、makeRippleというクラス名、定義ファイル名、function名は同じにしておくことと、functionの引数を共通にしておくことが注意点である。このスクリプト記載のfunctionはコンストラクタ関数とよばれ、swfファイルから引数つきでまず呼び出される関数である。
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 このサイトで使用しました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講座総リスト      flash アクションスクリプト 応用編 (7)