ストラクチャを作る3

テクスチャを使ってみる

AddVertexとAddFaceとSetcolorを駆使して家屋を作る…こともできないわけではありませんが、ストラクチャの頂点の数が増えていくと読み込みに時間がかかるようになります。ここで、面に画像を貼り付ければ公式の作成例のように頂点の数を大幅に減らしつつ「らしく」見えるオブジェクトができます。今回は単純な四角形のストラクチャにテクスチャといいますがこれまた適当な四角形の画像を貼ることにします。

CreateMeshBuilder
AddVertex,1,0,0
AddVertex,1,-1,0
AddVertex,-1,-1,0
AddVertex,-1,0,0
AddFace,0,1,2,3
GenerateNormals

次にテクスチャ画像を読み込ませるのですが、テクスチャに利用できる画像は、サイズが縦横共に2の累乗(2,4,8,16,32,64,128,256,512,1024…)ピクセルでないといけないのと、bmpかpng形式で保存されていないといけません。pngではアルファチャンネルの利用もできます。まずはとにかく画像を用意します。
…というわけで用意しました。
用意したテクスチャ
上の画像を使います。右クリックして名前を付けて保存でダウンロードしてください。
画像の保存先は先ほど作った四角形のストラクチャファイルと同じフォルダにしておいてください。相対パスで指定できればいいので画像は同じフォルダになくてもいいのですがいろいろ面倒事のもとなので最初はこうしておきます。
1つ上の階層へは..\(ファイル名)、1つ下の階層へは.\(フォルダ名)\(ファイル名)、同一階層は.\(ファイル名)か(ファイル名)で指定できます。

LoadTexture, block.bmp

拡張子もつけて画像のファイル名を入れますが、ここで書いた場所に画像ファイルがないとエラーが出ます。画像がきちんとあるにもかかわらずエラーが出る場合はパス名が間違っていないかどうか、フォルダ名、ファイル名、拡張子をよく確認してください。

これでテクスチャを面に貼り付ける準備ができました。実際に貼り付けていく作業に入ります。まず、SetTextureCoordinates,という構文を書いてください。
カンマの次の数字がAddvertexで作った頂点番号と対応するようになっているので、SetTextureCoordinates,0は頂点番号0番のAddVertex,1,0,0と対応します。

SetTextureCoordinates,0,
SetTextureCoordinates,1,
SetTextureCoordinates,2,
SetTextureCoordinates,3,

…これで四角形を作る頂点全てを指定できました。次にSetTextureCoordinates,0の後ろに「1,0」と書き加えてください。

SetTextureCoordinates,0,1,0

ところで、SetTextureCoordinates,0は頂点番号0番と対応しているという意味でした。
その後ろの数字「1,0」は画像の位置を示す座標です。画像の左上が(0,0)、右上が(1,0)、右下が(1,1)、左下が(0,1)になります。面の右上に位置する頂点番号0番に画像の右上をもってくるとすると構文はSetTextureCoordinates,0,1,0になります。
以下同様に面の右下に位置する頂点番号1番に画像の右下をもってくるためにはSetTextureCoordinates,1,1,1
面の左下に位置する頂点番号2番に画像の左下をもってくるためにはSetTextureCoordinates,2,0,1
面の左上に位置する頂点番号3番に画像の左上をもってくるためにはSetTextureCoordinates,3,0,0とすればバッチリです。
ビューワで見ると青が右上に、赤が右下に、緑が左下に、黒が左上になっていると思います。

テクスチャを貼ったオブジェクト
面に無事テクスチャを貼ることができました!

テクスチャを左右反転させて面に貼る

慣れるためにももう一つ作ってみます。さっきと同じ四角形のオブジェクトと画像(block.bmp)を用意します。
画像の左上(0,0)が面の右上(頂点番号0番)に、画像の右上(1,0)が面の左上(頂点番号3番)に、画像の左下(0,1)が面の右下(頂点番号1番)に、画像の右下(1,1)が面の左下(頂点番号2番)になるようにしてみてください。

テクスチャを貼ったオブジェクトのテクスチャ左右逆ver
…画像の左右が逆になったと思います。これが出来たら上下を反対にすることもできると思います。
慣れるまでは頭がこんがらがりますが「画像の左上が(0,0)、右上が(1,0)、右下が(1,1)、左下が(0,1)」を思い出しつつがんばってください。

テクスチャを自由自在に使いこなす

では、もう一度最初に作った左右反対になっていないほうのストラクチャファイルをコピーして別のものを作ってみます。
今度は画像の左上と右上の中間の位置(0.5,0)に面の右上(頂点番号0番)がくるように、画像の左下と右下の中間の位置(0.5,1)に面の右下(頂点番号1番)がくるようにしてみてください。

テクスチャの左半分を貼ったオブジェクト
まあ、あったりまえなのですがびよーんと黒と緑がオブジェクトの端に来ました。なんか感動しませんか?
自分はいつも超感動してます。
同じように画像の上半分だけを面に貼る、下半分だけを面に貼る、画像の緑の部分だけを面に貼るなんて芸当が可能です。

では次はさっきと同じように最初のストラクチャデータを使って、さっきと逆のことをしてみます。やることは単純、画像の位置を示す座標を全て2倍にします。…頂点番号のほうまで二倍にしないでね?
…すると、
テクスチャを縦方向に2枚、横方向に2枚を貼ったオブジェクト
縦方向に2枚、横方向に2枚のテクスチャが面に貼られました。テクスチャを単純に繰り返したいときにはこの方法を使います。

透過します

テクスチャにSetDecalTransparentColor,で指定したRGB値があるとその色を透明にすることができます。
緑の電車の窓を赤で塗り、SetDecalTransparentColor,255,0,0とすれば赤で塗った窓が透明になるということですね。

Bve5で使えるようにする

ここまで色々なストラクチャファイルを作って、ビューワで眺めて感動してきましたが、テキストエディタで構文を打って作ったcsv形式のストラクチャファイルは前にも言ったようにBve5に対応していません。
こちらのRock_Onさん作ストラクチャコンバータをダウンロードしてファイルを変換します。
「drop here」と枠で囲われている部分にストラクチャファイルをドラッグアンドドロップしたら「start convert」ボタンをポチッっとな。すると、csv形式がx形式に、テクスチャを使っている場合はbmp形式がpng形式に変換されBve5で使える形式になります。
ところで、コンバータですがファイルをドロッグアンドドロップして変換した後、コンバータを開いたまま元のcsvファイルをいじってもコンバータが変換元のファイルをロックしているらしく保存ができないようです。変換したら閉じておくようにしたほうがいいと思います。
これであなたもストラクチャ制作者!お疲れ様でした。