ActionScript 3.0入門ノート CS4でタグ「テクスチャ」が付けられているもの

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

 図形を分割する頂点をマウスでドラッグするように動かして再描画すれば、図形をマウスドラッグで変形させることができます。次の例では四角形を図のように4分割し、2番の頂点をマウス座標に合わせて移動させています。

fig09-03-18_shiji.jpg fig09-03-19.jpg
fig: マウス座標の位置に頂点2を作り、頂点をマウスドラッグで移動させます。
swfを試す

 ただし、クリックした座標に単純に2番の頂点を移動させるとドラッグしなくてもマウスダウンしただけでテクスチャが変形してしまいます。そこでマウスダウンした位置のUV座標も再計算して再描画します(52行目)。この状態からマウスドラッグに合わせて頂点を移動させれば(61行目)、マウスダウンした位置から頂点をドラッグすることになり、マウスでイメージをつかんで引っ張っているように見えます。

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

 図形にビットマップデータをテクスチャとして貼るには、各頂点がビットマップデータのどの位置になるかをUV座標で指定します。UV座標はビットマップデータの左上角を(0,0)、右下角を(1,1)とした比率で示す座標です。

fig09-03-10_shiji.jpg
 次のサンプルは三角形を描き、ビットマップデータの左上半分をテクスチャとして塗るスクリプトです。三角形の頂点の座標をvertices、描画する頂点番号をindices、そして頂点に対応するビットマップのUV座標をuvtDataで指定しています。ビットマップデータはビットマップシンボルをIMG_8268の名前でリンケージ書き出ししています。

[:script:]三角形にビットマップデータのテクスチャを貼る
var shape:Shape=new Shape();
//ビットマップデータで塗る
var bmpdata:BitmapData=new IMG_8268(0,0);
shape.graphics.beginBitmapFill(bmpdata);
//頂点の座標
var vertices:Vector.<Number>=Vector.<Number>([0,0, 320,0, 0,240]);
//三角形を描く頂点
var indices:Vector.<int>=Vector.<int>([0,1,2]);
//頂点のUV座標(0〜1)
var uvtData:Vector.<Number>=Vector.<Number>([0,0, 1,0, 0,1]);
//三角形を描く
shape.graphics.drawTriangles(vertices,indices,uvtData);
shape.graphics.endFill();
shape.x=50;
shape.y=50;
addChild(shape);

fig09-03-12.jpg

まったく新しいAS3の世界!
694a.jpg
Adobe Flash CS4
詳細!ActionScript3.0入門ノート[完全改訂版](CD-ROM付)

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

タグ

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

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