渋谷ほととぎす通信

完全趣味でやってるUnityメモ。説明できないところを説明できるようにするための個人ブログ。昨日の自分より少しでも大きくなれるように。。。 ※所属団体とは一切関係がありません

C#でDirectX11 SlimDXで三角形を描画する


WebGLでもやりましたが、DirectXで三角形を描画してみます。

描画するウィンドウの生成や、GPUを使用するまでの手順は、こちらにまとめました。

上記の内容を踏まえて三角形1個を描画してみます。

WebGLの時にもありましたが、三角形を描画するために頂点バッファシェーダシェーダに渡すデータの紐づけ的なものがDirectXでも必要になってきます。

頂点バッファ

頂点バッファの作成にはSlimDX.Direct3D11.Bufferクラスを使います。 頂点バッファはその名の通り、各頂点データのことで、座標やカラー法線ベクトルなどを保持します。今回は頂点のみ使用します。

Bufferを生成するためにはDeviceDataStreamBufferDescriptionを渡します。 この中で新たに登場したDataStreamBufferDescription

DataStream

コンストラクタの引数で頂点の配列を渡していることから、頂点バッファをを生成するためのデータ本体が格納されいているようです。また、読み取り書き込みの設定もできるクラスです。

BufferDescription

~~Descriptionというのがちょいちょい出てきますが、これは頂点バッファの情報をセットしたデータです。 バッファのサイズ、バッファの種類をセットします。

バインドするバッファの種類はWebGLと近しいにおいがして懐かしいです。

シェーダ

次にシェーダです。 WebGlだとGLSLを直接HTMLに書いたりしますが、DirectXではHLSLで書いていきます。
.fxという拡張子を使うようです。

先にシェーダのコードから。

GLSL民から見ると見慣れないコードtechique10を調べてみます。

Effect Technique Syntax (Direct3D 10) | Microsoft Docs

公式リファレンスをのぞいてみると、シェーダ内の設定を行うシンタックスだということがわかります。
頂点シェーダ、ピクセルシェーダ、ブレンド、ステンシルのステートを定義するものだという風に理解しました。

上記のコードでは、MyVertexShaderMyPixelShaderという関数がシェーダの関数だということを定義しています。

また、シェーダファイルはあくまでテキストデータなので、コンパイルする必要があります。

シェーダを外部ファイルとして定義しているので、ShaderBytecode.CompileFromFileメソッドでコンパイルします。

該当コードはこちら gist.github.com

シェーダに渡すデータの紐づけ的なもの

頂点バッファに含めるデータは、位置、色、UV座標など様々ですが、これらはただの数値の塊で、GPUがどう解釈してよいかはわかりません。
それを解決するのがInputLayoutです。

渡されたデータの中のxx~yyバイトまでは位置情報‘という感じになっているようです。

InputLayoutを作成するにあたって、Device、ShaderSignature、InputElement配列が必要です。 この中で初登場かつ、よくわからないものはShaderSignatureなのですが、これはコードから察するにシェーダ内のパス情報ということになります。

InputElementは各頂点の定義情報ということになります。

これらの情報をもとに、GPUが解釈する方法を決めているということなのでしょう。

ビューポートの設定

前回は背景を塗りつぶすだけだったので不要でしたが、今回は描画する範囲ビューポートの設定が別途必要になってきます。


次にループ時に行う描画処理について実装していきます。

f:id:esakun:20181114153237p:plain

実行するとこのように三角形が1つ佇みます。


全体コードはコチラ

まとめ

だいぶコードが長くなってきましたが、WebGLを生で書いて三角形を描画した時と、やってることはそう変わらない感じで親近感が持てました。

リスペクト