サイトトップ

Director Flash 書籍 業務内容 プロフィール

Macromedia Flash非公式テクニカルノート

スクリプトでフィルタを使う − BlurFilter

ID: FN0511001 Product: Flash

Platform: All
Version: Professional 8.0 and above

Flash Prefessional 8には、多彩なフィルタが搭載されました。これらのフィルタは、スクリプトで制御することも可能です。本稿ではおもにぼかしフィルタ(flash.filters.BlurFilter)を例として、スクリプトによるフィルタの基本的な使い方についてご説明いたします。

1. フィルタのインスタンスを作成する
Flash 8には各フィルタごとに、クラスが用意されています。したがって、まず(1)そのフィルタクラスのインスタンスを作成しなければなりません。そして、新しいプロパティMovieClip.filtersにそのフィルタを設定します。ただし、フィルタのインスタンスを、そのまま設定する訳ではありません。フィルタは(2)配列つまりArrayインスタンスを作成したうえで、(3)その配列にフィルタインスタンスを格納し、(4)その配列インスタンスをMovieClip.filtersプロパティに設定するというかたちを取ります(表001)。

表001■MovieClipにフィルタを適用する手順

(1) フィルタインスタンスの作成
(2) 配列インスタンスの作成
(3) 配列インスタンスにフィルタインスタンスを格納
(4) MovieClip.filtersプロパティに配列インスタンスを設定

配列(Array)インスタンスには、複数の値を要素(エレメント)として格納することができます。フィルタインスタンスを直接MovieClip.filtersプロパティに設定しないのは、複数のフィルタインスタンスを配列に格納することで、フィルタを組合わせて適用できるようにするための仕様だと思われます。

ActionScriptのクラスを使うには、多くの場合インスタンスを作成することが必要です。これは、[ライブラリ]のシンボルを使うとき、ステージにドロップしてインスタンスを配置するのと同じことです。クラスのインスタンスは、newという演算子を使ってスクリプトで作成します。たとえば、Dateクラスのインスタンスを作成して、データ内容を出力するのは、つぎのようなステートメントです(スクリプト001)。

スクリプト001■Dateインスタンスを作成してデータ内容を出力

trace(new Date());
// [出力]:
// Wed Nov 30 20:00:00 GMT+0900 2005

new演算子で作成したインスタンスは、そのままではメモリに残りません。したがって、後でアクセスできるように、変数に格納するのが定石です。すると、その変数をインスタンスとしてターゲットに指定すれば、クラスのプロパティやメソッドにアクセスすることができます。たとえば、Dateインスタンスを作成して、年月日を出力するには、つぎのようなスクリプトを記述します(スクリプト002)。

スクリプト002■Dateインスタンスを変数に格納して年月日を出力

// Dateインスタンスを変数my_dateに格納
var my_date:Date = new Date();   // [*1]
trace(my_date.getFullYear());   // [出力]: 2005
trace(my_date.getMonth());   // [出力]: 10[*2]
trace(my_date.getDate());   // [出力]: 30

配列やフィルタのインスタンスも、同じようにnew演算子を使って生成します。ただし、フィルタはクラス名の前にドットシンタックスで、パッケージパスというものをつけ加えなければなりません。たとえば、つぎのスクリプトで、配列(Array)インスタンスは、正しく生成することができます。しかし、ぼかしフィルタBlurFilterクラスのインスタンスは作成できず、スクリプトエラーになります(スクリプト003)[*3]。

スクリプト003■配列(Array)とフィルタ(BlurFilter)のインスタンス生成

// 配列(Array)インスタンスの作成
var my_array:Array = new Array();   // OK
// BlurFilerインスタンスの作成
var myBlur:BlurFilter = new BlurFilter();   // スクリプトエラー

// [出力]パネルに表示されたエラー:
クラスまたはインターフェイス 'BlurFilter' をロードできませんでした。
var myBlur:BlurFilter = new BlurFilter();

フィルタのクラスのパッケージパスは、基本的にflash.filtersになります。オンラインヘルブの「ActionScript 2.0リファレンスガイド」で、たとえばBlurFilterクラスを調べると、パッケージパスをつけ加えたいわばフルパスのクラス名[*4]が確認できます。BlurFilterクラスの場合は、flash.filters.BlurFilterです。

図001■「ActionScript 2.0リファレンスガイド」のBlurFilterクラスの記載
flash.filters.BlurFilter

したがって、BlurFilterインスタンスは、つぎのステートメントで生成します(スクリプト004)。なお、変数の型指定にも、パッケージパスが必要です。

スクリプト004■フィルタ(BlurFilter)インスタンスの生成

// BlurFilerインスタンスの作成
var myBlur:flash.filters.BlurFilter = new flash.filters.BlurFilter();

[ムービープレビュー]で[変数のリストアップ]([デバッグ]メニュー)を実行すれば、[出力]パネルでつぎのようにインスタンスの内容を確認できます。

// [出力]:
変数 _level0.myBlur = [オブジェクト #1] {
     blurX:[getter/setter] 4,
     blurY:[getter/setter] 4,
     quality:[getter/setter] 1
   }

[*1] varは、新たな変数を宣言するステートメントです。Flash 5から使用は可能です。ただ、ActionScript 1.0ではタイムラインに定義する変数(タイムライン変数)には、変数の宣言がなくてもとくに問題はありません。ですから、実際にはタイムライン変数には、var宣言は使われないことが少なくありませんでした。

ActionScript 2.0では、var宣言した変数には、コロン(:)に続けてその変数に代入する値の種類(データ型)を指定できるようになりました。クラスのインスタンスにはデータ型として、クラス名を指定します。

  var 変数名:クラス名;   // 宣言と同時に値の代入も可能

ActionScript 2.0は、外部ActionScriptファイルでクラス定義をしたとき、その真価を発揮します。そのため、fla(ムービー)ファイル内のフレームアクションやMovieClipアクションでは、あまりそのメリットが感じられないかもしれません。しかし、ActionScript 2.0のクラス定義や、将来のActionScript 3.0を使う場合に備えて、この文法(シンタックス)に慣れておくとよいでしょう。

[*2] Date.getMonth()メソッドは、1月を0とした正の整数を返します。したがって、整数10は11月を表します。

[*3] スクリプトエラーが表示されるのは、BlurFilterインスタンスが型指定されているためです。データ型の指定をしなければ、エラーは表示されず、コンパイル(SWF出力)できます。ただし、インスタンスは生成されないので、変数には未定義値undefinedが代入されます。

[*4] フルパスのクラス名を、ヘルプでは「完全修飾クラス名」(fully qualified class name)と呼んでいます。ただし、英語の"qualify"は、詳しい意義づけをして限定するといった意味です。「修飾」という訳語が適当かどうかには、疑問もあります。

2. ぼかしフィルタBlurFilterインスタンスの設定
フィルタインスタンスを作成するのに、毎回パッケージパスを記述するのは面倒です。これがたとえば文章でしたら、作曲家のバッハのことを書くのに、最初に一度だけフルネームをヨハン・ゼバスティアン・バッハ(Johann Sebastian Bach)と紹介し、「以下バッハ(Bach)」とするのが普通でしょう。ActionScriptにも、これと同じ機能を実現するステートメントがあります。

importステートメントを使って、クラスをパッケージパスつきの完全な記述で宣言すれば、それ以降そのスクリプトペイン(ウィンドウ)内ではクラス名のみでアクセスすることが可能になります。仮にjohann.sebastian.Bachというクラスがあったとすれば、つぎのようにインスタンスを作成することができます。

   // importステートメントでBachクラスのフルパスを宣言
   import johann.sebastian.Bach;
   // 以下Bachのみでクラスにアクセス可能
   var myMusician:Bach = new Bach();

new演算子を使ってクラスのインスタンスを生成する関数は、「コンストラクタ」関数と呼ばれます。コンストラクタも関数ですので、引数(パラメータ)を指定できるものがあります。フィルタにはさまざまな設定が可能ですので、それらの設定を決める値は引数としてコンストラクタに渡します。

たとえばBlurFilterクラスなら、「ActionScript 2.0リファレンスガイド」で「BlurFilterコンストラクタ」の項で、その引数の種類や設定できる値を調べることができます。項目の冒頭には、つぎのように説明されています。

BlurFilterコンストラクタ
public BlurFilter([blurX:Number], [blurY:Number], [quality:Number])

publicの記載は、とくに気にする必要はありません[*5]。引数を括る括弧[]は、オプションつまり省略可能であることを意味します。BlurFilterコンストラクタでは、3つの引数すべてがオプションで、省略した場合にはデフォルト値が設定されます。

引数を表す変数名(blurX、blurY、quality)の後にコロン(:)に続けて添えられているのは、var宣言した変数と同じく、ActionScript 2.0の型指定です。つまり、すべての引数が、数値で指定されるべきことを示しています。

blurXとblurYは、それぞれ水平方向と垂直方向のぼかし量で、0から255までの浮動小数値で指定します[*6]。デフォルト値は4です。この値は、ピクセル数に対応します。つまり、フィルタを適用するMovieClipのサイズが拡大・縮小されても、ぼけ幅は変わりません。また、水平・垂直方向はステージを基準に決められます。ですから、インスタンスを回転しても、適用方向はステージに対して水平・垂直のまま変わりません。

qualityは、0から15までの整数で、ぼかしの実行回数を指定します。実際には、1から3までの値を使用すれば足ります[*7]。2が「ぼかし(強)」に、3が「ぼかし(ガウス)」に相当します。デフォルト値は1です。

以下のスクリプト(スクリプト005)は、水平・垂直方向のぼかし量をともに10、ぼかし(強)に相当するぼかし回数2でBlurFilterクラスのインスタンスを作成します。

スクリプト005■引数を指定してBlurFilterインスタンスを作成

// 最初にクラスをパッケージパスつきで宣言
import flash.filters.BlurFilter;
// 以下はクラス名のみでアクセス可能
// BlurFilerインスタンスの作成
// 水平・垂直のぼかし量10、ぼかし回数2
var myBlur:BlurFilter = new BlurFilter(10, 10, 2);


[*5] publicの指定は、クラスのインスタンスまたはクラス自身をターゲットにして、外部からメソッドやプロパティへのアクセスが可能なことを示します。しかし、リファレンスガイドに掲載されるのは、通常外部からアクセスできるメソッドやプロパティです。つまり、基本的にすべてのメソッドがpublicです。

[*6] 2のベキ乗(Math.pow(2, n): 2、4、8、16、32など)の整数値は処理が最適化されるので、他の値よりも速くレンダリングされます。

[*7] 数値0では、ぼかしが実行されません。また、3より大きい数値を設定しても、CPUの負荷が上がるだけで、効果にはあまり変化が生じません。ぼかしをさらに強めたいときには、ぼかし量(blurXやblurY)の値を増加させます。

3. フィルタインスタンスをMovieClipに適用する
フィルタをMovieClipに適用するには、フィルタインスタンスを配列(Arrayインスタンス)に格納し、その配列インスタンスをMovieClip.filtersプロパティに設定します。配列に要素(エレメント)を追加するには、Array.push()メソッドを使います。メソッドの引数には、追加すべきフィルタインスタンスを指定します。

配列には、クラスのインスタンスや単純(プリミティブ)な数値、文字など任意の値を格納できます。たとえば、つぎのスクリプト(スクリプト006)は、新規の配列(Array)インスタンスを作成して、文字列"a"と"b"を追加します。

スクリプト006■Array.push()メソッドでエレメントを追加

var my_array:Array = new Array();
my_array.push("a", "b");
trace(my_array); // [出力]: a,b

[ムービープレビュー]時に、[変数のリストアップ]([デバッグ]メニュー)を行えば、配列の内容が確認できます。エレメントには0から始まる整数のインデックス番号が、自動的に設定されます。

// [出力]:
変数 _level0.my_array = [オブジェクト #1, クラス 'Array'] [
     0:"a",
     1:"b"
   ]

ステージに配置されたMovieClipインスタンスmy_mcに、水平・垂直方向のぼかし量10、ぼかし実行回数2のBlurFilterを適用するには、つぎのようなスクリプトを記述します(スクリプト007・図002)。

スクリプト007■MovieClipにBlurFilterインスタンスを設定

import flash.filters.BlurFilter;
var my_mc:MovieClip; // MovieClipインスタンスの宣言[*8]
// Arrayインスタンスの作成
var filters_array:Array = new Array();
// BlurFilerインスタンスの作成
var myBlur:BlurFilter = new BlurFilter(10, 10, 2);
// ArrayにBlurFilterインスタンスを追加
filters_array.push(myBlur);
// ArrayインスタンスをMovieClip.filtersプロパティに設定
my_mc.filters = filters_array;

図002■ぼかしフィルタが適用されたMovieClipインスタンス(左)
ぼかしフィルタが適用されたMovieClip

配列(Array)インスタンスは、new演算子を用いず、配列アクセス演算子[]だけでインスタンスを生成することができます。また、配列アクセス演算子[]の中にエレメントとすべき値をカンマ区切りで記述すれば、要素の格納されたArrayインスタンスを作成することも可能です(スクリプト008)。

スクリプト008■配列アクセス演算子[]でArrayインスタンスを作成

var my0_array:Array = [];
var my1_array:Array = ["a", "b"];

// [デバッグ] > [変数のリストアップ]:
変数 _level0.my0_array = [オブジェクト #1, クラス 'Array'] []
変数 _level0.my1_array = [オブジェクト #2, クラス 'Array'] [
     0:"a",
     1:"b"
   ]

したがって、上記スクリプト007は、つぎのように短く記述することもできます(スクリプト009)。

スクリプト009■配列アクセス演算子[]でBlurFilterの格納された配列を作成して設定

import flash.filters.BlurFilter;
var my_mc:MovieClip;
// var filters_array:Array = new Array();
var myBlur:BlurFilter = new BlurFilter(10, 10, 2);
// filters_array.push(myBlur);
// BlurFilerインスタンスの格納された配列を作成して設定
my_mc.filters = [myBlur];

MovieClipに適用したフィルタをすべてクリアするには、MovieClip.filtersプロパティに空の配列インスタンスを設定します。

   my_mc.filters = new Array();
   // または
   my_mc.filters = [];

ところで、MovieClip.filtersプロパティはArray型です。したがって、このプロパティに対して、Array.push()メソッドを使うこともできます。しかし、「新しいフィルタオブジェクトを MovieClip.filters配列に直接追加することはできません」(「ActionScript 2.0リファレンスガイド」のMovieClip.filtersプロパティの項)[*9]。つまり、MoiveClip.filtersプロパティに、直接フィルタインスタンスをArray.push()メソッドで追加しても、そのフィルタはMovieClipに適用されません。

[*8] スクリプトで作成されるのではなく、予めステージに配置してあるインスタンスについても、ActionScript 2.0の型指定を行うことは可能です。型指定をするとスクリプトの作成時に、そのインスタンスに対してコードヒントが表示されます。

[*9] MovieClip.filtersプロパティは、黙示的なget/setメソッドのようです。プロパティに配列が設定されると、配列が複製されて内部的(private)なプロパティに設定されるものと考えられます。

配列の参照が渡されませんので、設定された配列内のフィルタインスタンスを変更しても、MovieClipに適用されたフィルタの効果は変わりません。フィルタの適用を変更するには、必ずMovieClip.filtersプロパティに代入演算子(=)を用いて、フィルタの配列を設定する必要があります。

_____

作成者: 野中文雄
更新日: 2006年1月8日 全体に小幅な修正・追加・リンク設定を加筆
作成日: 2005年11月30日


Copyright © 2001-2006 Fumio Nonaka.  All rights reserved.