描画コマンドと座標を配列で指定して描く drawPath()

|
(section09-03 Flash Player 10の新しいGraphicsメソッドから抜粋)

 moveTo()、lineTo()、curveTo()を使って直線や曲線で座標を結ぶことで図形を描くことができますが、辺の数だけ線を結ぶステートメントが必要です。新しく追加されたdrawPath()では、描画コマンドの配列と座標の配列を指定することで、図形の描画パスを1回で命令できます。drawPath()を使うことで描画スクリプトが簡潔になり、座標を数式で計算したり、外部から読み込む場合などにも対応しやすくなります。

書式
drawPath(commands:Vector, data:Vector, winding:String = "evenOdd"):void

 commandsは描画で使用するメソッドのベクター(データ型を指定した配列)です。使用できるコマンドは基本的にはmoveTo()、lineTo()、curveTo()と同じで、それぞれに1、2、3の数値が割り当ててあります。[1,2,2]ならば、moveTo()、lineTo()、lineTo()の順に実行することになります。dataは描画で使用する座標(x,y)のベクターです。[50,70,100,200,250,300]ならば、(50,70)と(100,200)と(250,300)の3つの点の座標を示しています。

 たとえば、commandsが[1,2,2]でdataが[50,70,100,200,250,300]ならば、moveTo(50,70)、lineTo(100,200)、lineTo(250,300)を実行することになり3つの点を結ぶ直線が引かれます。commandsが[1,3]ならば、moveTo(50,70)、curveTo(100,200,250,300)を実行して、(50,70)から(250,300)への曲線が引かれます。(100,200)の点は曲線を描くためのコントロールポイントの座標として使用されます。

 ところで、commandsには0、4、5の数値に割り当ててあるコマンドもあります。0は何もせずに次のコマンドに進みます。4、5はそれぞれmoveTo()とlineTo()を実行しますが、通常は引数が(x,y)と2個のところを(dummy,dummy,x,y)のように4個の座標値を使用し、最初の2個は無視します。これはcurveTo()で使用するコントロールポイントの座標を無視して描画するためです。先の例のcommandsが[1,3]のところを[1,5]にするとコントロールポイントの座標を無視して(50,70)から(250,300)へ直線で結びます。
 commandsで使用する0〜5の値は、次のようにGraphicsPathCommandクラスでクラス定数として定義してあります。


値  定数              実行するメソッド
0  GraphicsPathCommand.NO_OP  何も実行しない
1  GraphicsPathCommand.MOVE_TO  moveTo(x1,y1)
2  GraphicsPathCommand.LINE_TO  lineTo(x1,y1)
3  GraphicsPathCommand.CURVE_TO  curveTo(x1,y1,x2,y2)
4  GraphicsPathCommand.WIDE_MOVE_TO  値を2個とばしてmoveTo(x2,y2)
5  GraphicsPathCommand.WIDE_LINE_TO  値を2個とばしてlineTo(x2,y2)


 最後のwindingは図形が交差した領域を塗るかどうかを決めるパラメータです。値は"evenOdd"または"nonZero"をとります。この値については後ほどサンプルを示します。
まったく新しいAS3の世界!
694a.jpg
Adobe Flash CS4
詳細!ActionScript3.0入門ノート[完全改訂版](CD-ROM付)

楽しいActionScript。
新たなる1歩へと踏み出しましょう。
■内容は?→ 目次を見る
■評判は?→ 書評を読む
この本を書いたわけ

このブログ記事について

このページは、oshigeが2009年7月25日 09:22に書いたブログ記事です。

ひとつ前のブログ記事は「線をビットマップで描く」です。

次のブログ記事は「drawPath()を使って図形を描く」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

あわせて読みたいブログパーツ