Pixel Bender シェーダーの基礎

Flash Player 10 以降、Adobe AIR 1.5 以降

Adobe Pixel Bender は、イメージコンテンツの作成や操作に使用するプログラミング言語です。Pixel Bender を使用して、カーネル(シェーダーとも呼ばれます)を作成します。シェーダーでは、イメージの各ピクセルで個別に実行される単一の関数を定義します。各関数呼び出し結果が、イメージ内のそのピクセル座標の出力カラーとなります。 入力イメージおよびパラメーター値を指定して、操作をカスタマイズできます。シェーダーの 1 回の実行では、入力およびパラメーター値は一定です。唯一変化するのは、関数呼び出しの結果がカラーとなるピクセル座標です。

可能な場合は、複数の出力ピクセル座標のシェーダー関数が並列で呼び出されます。これにより、シェーダーのパフォーマンスが向上し、パフォーマンスに優れた処理を提供できます。

ActionScript では、シェーダーを使用して次の 3 種類のエフェクトを簡単に作成できます。

  • 描画の塗り

  • ブレンドモード

  • フィルター

シェーダーは、スタンドアローンモードでも実行できます。スタンドアローンモードを使用する場合は、事前に用途を指定せずに、シェーダーの結果に直接アクセスします。結果はイメージデータ、バイナリデータ、数値データとしてアクセスできます。データがイメージデータである必要はありません。これらのデータセットを入力としてシェーダーに指定できます。シェーダーでデータが処理されると、シェーダーで返された結果データにアクセスできます。

Pixel Bender は、Flash Player 10 および Adobe AIR 1.5 以降でサポートされています。Pixel Bender のブレンド、フィルター、および塗りは GPU レンダリングではサポートされていません。モバイルデバイスでは、Pixel Bender シェーダーは CPU レンダリングで実行されます。ただし、デスクトップコンピューターの場合と同じレベルのパフォーマンスは得られません。多くのシェーダープログラムを実行する場合のフレームレートは毎秒数フレームです。

重要な概念と用語

次の参照リストに、Pixel Bender シェーダーの作成および使用に関連した重要な用語を示します。

カーネル
Pixel Bender では、カーネルはシェーダーと同じものです。Pixel Bender のコードでカーネルを定義し、イメージの各ピクセルで個別に実行される単一の関数を定義します。

Pixel Bender バイトコード
Pixel Bender カーネルは、コンパイル時に Pixel Bender バイトコードに変換されます。バイトコードは、実行時にアクセスされ、実行されます。

Pixel Bender 言語
Pixel Bender カーネルの作成に使用するプログラミング言語です。

Pixel Bender Toolkit
Pixel Bender ソースコードから Pixel Bender バイトコードファイルを作成するのに使用するアプリケーションです。ツールキットを使用して、Pixel Bender ソースコードを作成、テスト、コンパイルできます。

Shader
本書の用途では、シェーダーとは Pixel Bender 言語で作成された一連の機能です。シェーダーのコードでは、ビジュアルエフェクトの作成や計算の実行が行われます。どちらの場合も、シェーダーではデータセットが返されます(通常はイメージのピクセル)。シェーダーは各データポイントで同じ操作を実行しますが、唯一の違いは出力ピクセルの座標です。シェーダーは ActionScript で作成するのではありません。Pixel Bender 言語で作成され、Pixel Bender バイトコードにコンパイルされます。コンパイル時に SWF ファイルに埋め込んだり、実行時に外部ファイルとしてロードしたりできます。どちらの場合も、ActionScript で、Shader オブジェクトを作成し、そのオブジェクトをシェーダーのバイトコードにリンクすることでアクセスします。

シェーダー入力
計算で使用するためにシェーダーに提供される複雑な入力であり、通常はビットマップイメージデータです。シェーダーで定義される各入力変数では、単一値(つまり、単一のイメージまたはバイナリデータセット)がシェーダーの実行全体に使用されます。

シェーダーパラメーター
計算で使用するためにシェーダーに提供される単一値(または値の制限されたセット)です。各パラメーター値は単一のシェーダー実行用に定義され、シェーダー実行全体で同じ値が使用されます。

コード例の使用

記載されているサンプルコードリストを実際にテストすることができます。コードをテストするには、コードを実行し、作成された SWF で結果を確認する必要があります。すべての例は、描画 API を使用して、シェーダーエフェクトを使用するコンテンツや、シェーダーエフェクトで変更されるコンテンツを作成します。

例で示すコードリストの大半は、2 つの部分から成ります。1 つは、例で使用するシェーダーの Pixel Bender ソースコードです。まず、Pixel Bender Toolkit を使用して、ソースコードを Pixel Bender バイトコードファイルにコンパイルする必要があります。Pixel Bender バイトコードファイルを作成するには、以下の手順を実行します。

  1. Adobe Pixel Bender Toolkit を開きます。必要に応じて、メニューの Build/Turn on Flash Player warnings and errors を選択します。

  2. Pixel Bender コードリストをコピーし、Pixel Bender Toolkit のコードエディターペインに貼り付けます。

  3. メニューの File/Export kernel filter for Flash Player を選択します。

  4. Pixel Bender バイトコードファイルを Flash ドキュメントと同じディレクトリに保存します。ファイル名は、例の説明で指定されている名前と一致している必要があります。

各例の ActionScript の部分は、クラスファイルとして作成されています。この例を Flash Professional でテストするには、次のようにします。

  1. 新しい Flash ドキュメントを作成し、コンピューターに保存します。

  2. 新しい ActionScript ファイルを作成し、Flash ドキュメントと同じディレクトリに保存します。 ファイル名は、コードリスト内のクラスの名前と同じ名前にしてください。 例えば、コードリストで MyApplication というクラスが定義されている場合は、MyApplication.as という名前で ActionScript ファイルを保存します。

  3. ActionScript ファイル内にコードをコピーし、ファイルを保存します。

  4. Flash ドキュメント内で、ステージまたはワークスペースの空白部分をクリックして、ドキュメントのプロパティインスペクターをアクティブにします。

  5. プロパティインスペクターの「ドキュメントクラス」フィールドに、テキストからコピーした ActionScript クラスの名前を入力します。

  6. 制御/ムービープレビューを使用して、プログラムを実行します。

    例の結果がプレビューウィンドウに表示されます。

サンプルコードをテストするこれらのテクニックについては、ActionScript の使用方法の例で詳しく説明しています。