Max チュートリアル

チュートリアル42：
グラフィックス

グラフィックウィンドウ

Max では、音符に関する主要な情報を整数で記述することができ、この整数によってキーナンバー、ベロシティ、チャンネル、および（例えば makenote を使って）ミリ秒単位でのデュレーションを指定できます。また、Max では、スクリーン上に画像や、カラーによる幾何学図形を配置することができ、整数によってその位置、サイズ、描画の優先順位（前景ー背景の位置）、画像の色などを指定できます。音と画像は共に整数で記述されるため、簡単に、この２つが相互に関係づけられたパッチを書くことができます。

アニメーションを表示するためには、パッチ内に少なくとも１つの graphic オブジェクトが必要です。パッチが開かれるとき、それぞれの graphic オブジェクトは自動的にグラフィックウィンドウを開きます。

・この章のサンプルパッチを開くと、graphic オブジェクトによって graphics というタイトルを持ったウィンドウが開きます。

第１アーギュメントはグラフィックウィンドウに名前を付けるためのものです。名前はグラフィックウィンドウのタイトルバーに表示されます（このケースでは、グラフィックウィンドウのタイトルバーはメニューバーの後ろに隠れています）。他のオブジェクトは、ウィンドウに描画しようとする場合、このウィンドウ名を使ってウィンドウを参照します。

ウィンドウ名の後に続く４つの数値によるアーギュメントは、スクリーンの左上隅からピクセル単位でウィンドウの描画領域の四隅（上、左、右、下）を指定します。ここでは、正確に９インチの画面となるようなウィンドウを作成し、メニューバーを考慮して最上部から20 ピクセル離しています。

graphic オブジェクトは open および wclose メッセージを受信することができます。wclose メッセージはクローズボックスがメニューバーの背後に隠れているような場合、特に役に立ちます。当然ながら、一度閉じたウィンドウを再び開く場合には open メッセージが必要になります。また、ウィンドウを最前面に移動させるために open メッセージを使うこともできます。この例では、グラフィックウィンドウを前面に移動させた場合、完全にパッチャーウィンドウを覆ってしまうため、key オブジェクトを使って open および wclose のショートカットキー o および w も用意しておきました。

シェイプを描く

・open メッセージ、あるいはキーボードの o キーを使って、 Animation ウィンドウを前面に移動させて下さい。MIDI キーボードで、いくつかノートを演奏し、グラフィックウィンドウで何が起こるかをよく観察して下さい。演奏とスクリーン上のグラフィックとの相関関係を分析して下さい。

・Windows メニューから 42.Graphics を選ぶか、キーボードの w キーを使用して Animation ウィンドウを閉じて下さい。patcherEight Rectanles オブジェクトをダブルクリックして、その内容を調べて下さい。

演奏されたピッチとべロシティは poly オブジェクトに渡され、現在オンになっている個々のノートに対して１から８までの独自のボイスナンバーが割り当てられます。ピッチとべロシティは中央アウトレットと右アウトレットから送信され、ボイスナンバーは左アウトレットから送信されます。MIDI キーボードで同時に８つを超えるノートが押された場合、poly は最も古いノートに対してノートオフを送信し、新しいノートの場所を作ります。これはボイス・スティールとして知られているものです。第１アーギュメントはpoly に同時発音数を指示するためのもので、第２アーギュメントは（非 0 の場合）poly にボイススティールを行なうよう指示するためのものです。

ノートのピッチとべロシティは、グラフィックウィンドウに描画される矩形の特徴を決定するために使用されます。ボイスナンバーは、８つの異なる rect オブジェクトのうちの１つにメッセージをルーティングために使用されます。

シェイプや画像はグラフィックウィンドウの中でスプライトとしてアニメーション化されます。これは、自分自身を１つの場所に描画し、他の場所に描画した場合には、前の場所に描画してあったものを消去するオブジェクトです。rect のようなシェイプ描画オブジェクトは、それぞれ１つのスプライトをコントロールするため、同時に複数のシェイプを表示したい場合には、複数のオブジェクトが必要になります。ここでは、ほとんどのキーボード演奏スタイルを扱うために適切な数を考慮し、8 つの rect オブジェクトの使用を選択しました。

rect オブジェクトには、どのグラフィックウィンドウに描画するかを指示するためのアーギュメントが必要です。rect は、グラフィックウィンドウの描画領域の左上隅からの相対的な位置によって、四隅の座標（左、上、右、下）を指定するためのインレットを持っています。また、スプライトのペンモード(ペンモードのリストは、Max リファレンスマニュアルの oval を参照して下さい）と色の指定のためのインレットも持っています。ここでは、入力される MIDI データを使用して、描画されるシェイプのこれらの特徴を計算し、6 つのインレットすべてのための数値をリストとしてパックして、リストの先頭にボイスナンバーを結合させています。このため、矩形に関する完全な記述を適切な rect オブジェクトにルーティングすることができます。

このパッチではシェイプの描画のために rect オブジェクトのみ使用しますが、frame、 oval、 ring オブジェクトのインレットでも全く同じです。

グラフィックと MIDI の相関関係

MIDI データとグラフィックデータ間には、どのような対応関係を作成することも可能です。最も簡単な解決策は、単純にある値の範囲を他のものにマップするというものです。このパッチの中では、べロシティを使用して矩形の高さを計算し、ピッチを使用して矩形の左から右への配置を計算し、ピッチクラス（C, C#, D, 等）を使用して色を決定しています。

べロシティはは 0 から 127まで変化し、描画領域の垂直方向は（ピクセル単位で） 0から 322（342 - 20 = 322）までの範囲を持っています。すべての矩形を描画領域の垂直方向の中央に描画することにしたため、矩形の高さを中央からの上下の距離として計算する必要があります。これは、実際に使用する垂直方向の範囲を 0 から 161 ( 322 ÷ 2 = 161 )と 0 から -161 として、この矩形を 161 ピクセル下に移動させればよいということを意味しています。

べロシティを適切な範囲（ 0 から -161 または 0 から 161 ）に変換するために、-1.27あるいは 1.27を掛け、その後 161 を加えます。その結果の値は pack に送信され矩形の上下の座標として格納されます。べロシティが0 の場合、上下の座標は共に 161 となり、矩形の高さが 0 になることに注意して下さい。これによって、ノートがリリースされた場合には、高さ 0 の矩形が描画されるため、矩形は消えることになります。

矩形の水平座標に対するピッチの効果も同様な方法で計算されます。演奏されるピッチは 36から 96まで変化し、水平方向の範囲は（ピクセル単位で） 0 から 512です。まず、ピッチから 36 を引き、 0から 60 までの範囲とします。そして、上昇するスケールの各鍵ごとに 8 ピクセル右に移動させ、それぞれの矩形に 32ピクセルの幅を持たせておけば、キーボードからのノートは正確にグラフィックウィンドウ全体の幅に反映されるはずです。

シェイプ描画オブジェクトでは、256 色が利用でき、これには 0 から 255 までのナンバーが付けられています。モジュロ演算子 % を使って、ピッチのクラスを 0～11 までの数値として判定することができます。それぞれのピッチのクラスの値に１を加えて 1～ 12 の範囲に置き換え、その後、それぞれのピッチのクラスに 20 を掛けて 20 ～ 240 までの範囲に配分してから色を割り当てます。最後に、その値から 1 を引きます。これは、奇数ナンバーの色がモノクロモニタでは黒で表示されるためです。（この処理を行なわないと、モノクロモニタの場合、すべて白で描画されてしまうため何も表示されません）。

ピッチとベロシティの値は、ボイスナンバーより前にpoly から出力されるため、矩形の属性が全て計算されてpack に格納されてから、ボイスナンバーがメッセージをトリガし、route に送信して適切な rect に渡します。

・Eight Rectangles ウィンドウを閉じて、もう一度グラフィックウィンドウを開いて下さい。いくつかのノートを演奏して、矩形がこれまで述べたような振る舞いをしているかどうか確認して下さい。

画像とシェイプのアニメーション化

スプライトが動いているという錯角を与えることは、特定の軌道に沿って移動する異なった位置に、素早く、連続して描画するだけで可能です。従って数値の連続したストリームを出力するソース（ピッチベンドホイール、モジュレーションホイール、ボリュームペダル、couter 、clocker 、line など）を使ってアニメーションをコントロールすることができます。このパッチでは line オブジェクトを使用して画像を直線的に動かしています。同じ原理は、シェイプを動かす場合にも適用することができます。

・再びグラフィックウィンドウを閉じ、patcher Moving Picture オブジェクトをダブルクリックして下さい。

pict オブジェクトは画像ファイル全体をロードし、それをグラフィックウィンドウの中に表示します。pictはファイル全体をロードして表示するため、常に、画像が可能な限りグラフィックファイルの左隅に詰められているかどうかを確認する必要があるでしょう。これによって、ファイルが必要以上に大きくなったり、周りに余分な空白ができたりすることはなくなります。

pict オブジェクトの第１アーギュメントは、画像を表示させようとするグラフィックウィンドウの名前です。第２アーギュメントは表示するグラフィックファイルの名前です。ファイルは Max のサーチパス内に置かなければなりません。Max がファイルを見つけることができない場合には、Max ウィンドウにエラーメッセージが出力されるだけで、何も表示されません。

第３アーギュメントはスプライトのプライオリティ（優先度）です。スプライトのプライオリティが高いと、より最前面に近いと見なされ、プライオリティの低いスプライトよりも手前に表示されます。pictオブジェクトのデフォルトのプライオリティは 0 ですが、rect オブジェクトのデフォルトのプライオリティは 3です。そのため、デフォルトではrect が pict を覆ってしまうことになります。ここでは pict に高いプライオリティを与えたため、矩形の手前に画像が描画されます。

画像のサイズはグラフィックファイルの大きさによってあらかじめ決められているため、画像の配置を行なうときに　pict に与える必要がある座標は左上隅の２つだけです。　pict は左インレットで非0の数値、あるいは bang を受け取ると、指定された位置にピクチャーを描画します。

サンプルパッチでは、line オブジェクトを使って、指定されたゴールへの軌跡上で左と上の座標値を連続的に変化させています。画像の左座標のゴールは、矩形の場合のように、演奏されたノートのピッチから計算されます。ウィンドウの最も下から画像までの距離は、ノートオン・ベロシティの範囲（ 1 から 127 ) の、垂直方向のピクセル値 ( 0 から 322 ) へのマッピングによって決定されます。画像の高さが 32 ピクセルなので、垂直方向のピクセル値の実効範囲は 290 から 0 になります。ベロシティの値に -2.3 を掛けて 2 から -290 までの範囲とし、これに 292 を足して必要なピクセル範囲を得ています。

各々のline オブジェクトが画像をターゲットとなる座標に移動させるためにかかる時間は、timer オブジェクトを用いて前のノートオンから経過した時間を測定することによって決められます。補間のための 33ミリ秒という時間解像度は、画像をアニメーション化するために、毎秒 30 「フレーム」の速さが可能であるという理由で選択されています。実際に画像が再描画される速さは、コンピュータの処理速度に依存します。

まとめ

画像やカラーで描かれるシェイプはグラフィックウィンドウ内に描画されます。このウィンドウは、パッチの中に graphic オブジェクトを置くことによって作られます。graphic オブジェクトに与えられる名前を表すアーギュメントは、そのウィンドウ内に描画する、他のすべてのオブジェクトに対しても与えられます。frame、oval、rect、ring はグラフィックウィンドウ内に幾何学的なシェイプを描くために用いられます。pict オブジェクトはグラフィックファイル全体をメモリにロードし、グラフィックウィンドウ内の指定された位置に画像を表示します。

グラフィックウィンドウ内の個々の画像はスプライトで、座標を再定義することによって移動させることができます。また、他のスプライトの前面に描画されるか、背面に描画されるかを決定するためのプライオリティを割り当てることができます。スプライトはアニメーション化することができます。これは、選択された軌道に沿ってすばやく、次々と、違った位置に再描画し、連続した運動のような錯覚を与えるという方法によって行なわれます。どのような連続した数値の流れでも、この軌跡を記述するものとして使用することが可能です。

グラフィックウィンドウに描画されるシェイプや画像のパラメータと位置は、MIDI データと容易に関連づけることができ、それによってサウンドとイメージの間に望み通りの対応関係を作り上げることができます。これは、ほとんどの場合、値の範囲に係数を掛け、それらをMIDI データとして、また、ピクセル位置として使うために適切な範囲にすることによって行なうことができます。

poly オブジェクトは現在オンになっている個々のノートに対し、それぞれ固有なボイス・ナンバーを割り当てます。このボイスナンバーを使用して、ノート情報を、別々の描画オブジェクトのように、それぞれ異なった場所にルーティングすることができます。

参照

frame	グラフィックウィンドウに矩形のフレームを描画します。
graphic	グラフィックウィンドウを開きます。
oval	グラフィックウィンドウに楕円を描画します。
pics	グラフィックウィンドウ内のアニメーション。
pict	グラフィックウィンドウに画像を描画する。
rect	グラフィックウィンドウに矩形を描画する。
ring	グラフィックウィンドウに楕円形のフレームを描画する。
チュートリアル43	パッチャー内のグラフィックス。
Graphics	(Max トピックス) グラフィックウィンドウとオブジェクトの概要。

チュートリアル42： グラフィックス