drawTriangles
drawTrianglesの各入力パラメータが何なのか分かり易いようにサンプルを作りましたん。
[以下誰でも書ける三角形講座です]
verticesの値に 0, 150を追加してみましょう。(vertexになってますが気にしない。)
[0,0,100,0,100,150, 0, 150] となります。そして「draw」をクリック!
はい丸いのが一個増えましたね。
verticesは、x,y,x,yという順序で各頂点の座標を入力していくようです。三角形を書くには3つの点が必要なのでx,yで計6つになりますね。四角形なら8つですね♪
では、面を張りましょう。indicesのところが、0,1,2となっていますが、
これは頂点0,1,2に三角形の面を書くという事のようですね。
新しくできた丸は、verticesの順番上、頂点3のようですので、これに面を張るには、0と2と3の頂点を結んであげましょう。
[0,1,2,0,2,3]となります。フムフム。
さて次にUV(uvtData)です。これは各頂点ごとに画像(以下、テクスチャ)の位置を設定する必要があります。めんどいですねー。なので、verticesとuvのlengthは常に同じになるんです。(サンプルは、lengthが違う場合は自動でuvがnullになる「仕様」となっております。アシカラズ。
頂点3は画像,もといテクスチャの左下にあたりますねん。uvは、テクスチャの最小値が0で最大値が1みたいなので、左側はx軸的には0だよね?で、下はy軸的には1っぽいんで、例えば0,1って入力してやるとビンゴ!なわけです。
[0,0,1,0,1,1,0,1]ってなります。
verticesの値に0, 120を追加して[0,0,100,0,100,150, 0, 120]にした場合は、120÷150 =0.8なのでuvは、0 , 0.8を追加するとゆがみなく表示します。
でスクリプトで書くと
public function drawTriangles(vertices:Vector., indices:Vector. = null, uvtData:Vector. = null, culling:String = "none"):void
なので、テクスチャつけると
1 2 3 4 5 | graphics.beginBitmapFill( bitmapdata ); graphics.drawTriangles(Vector.<Number>([0,0,100,0,100,150]), Vector.<int>([0,1,2]), Vector.<Number>([0,0,1,0,1,1])); graphics.endFill(); |
みたいになります。
おまけ(丸を引っ張ると動くっす)
