📖

DirectX12で１からフレームワーク制作(４)

はろ～

2023/05/30に公開

はじめに

こんにちは、はろ～です。
今回は、テクスチャをポリゴンに貼り付けるまでしていきます。
開発環境はVisualStudio2022です。
Github:https://github.com/nakanoyui/DirectX12Framework

スクウェアポリゴン

とりあえずテクスチャを貼るためにポリゴンを四角形にしていきます。
Mesh.hの頂点用の変数を更新してください。

Mesh.cppもコンテナクラスをvectorに変更したので対応しておいてください。

プリミティブトポロジーの設定もTriangleListからTriangleStripに変更してください。

TriangleListは指定された三角形を独立した状態で描画します。今回は前述したように四つの頂点で四角形を描画するという技術を使用するので、今回使用しているTriangleStripを指定しています。
TriangleStripは三角形を接続されたものとして考えるため少ない頂点数でも多くの三角形を描画できます。※さらに詳しく知りたい方はMicrosoftの公式ドキュメントを閲覧する事をお勧めします。

頂点数が四つになったので、Mesh.cppにある描画関数も変更しておきましょう。

これで実行すれば、長方形が描画されるはずです。

インデックスバッファ

インデックスバッファとは、何個の頂点を描画するかとその頂点は頂点情報の何番目のインデックスかを示すものです。今回の場合だと四つの頂点があるが四角形を作るには六つの頂点が必要ですが、このインデックスバッファで、疑似的に六つの頂点が存在するようにしています。
※実際のコードを見て理解していってください。

Mesh.hにインデクスバッファようの変数を追加してください。

Mesh.cppのCreate関数でインデックスバッファの作成処理を実装してください。

Mesh.cppのDrawInstanced関数の中身も変更と追加をしてください。

最後にShader.cppのBegin関数のTriangleStripもTriangleListに戻しておいてください。

実行すると見た目は変わりませんが、さっきと同じ実行結果になっていることを確認してください。

テクスチャ

さて今回の目当てであるテクスチャをポリゴンに貼っていきましょう。

UV

UVはテクスチャ用の座標です。テクスチャのどの座標を取ってくるかを頂点情報に持たせてあげましょう。
Mesh.hに新しい構造体を追加し、頂点情報を変更しましょう。

Mesh.cppの頂点バッファ作成関数もデータが変わったので変更しておきましょう。

Application.cppの描画設定にもUV用の頂点レイアウトを追加してあげましょう。

Shader側の変更も行っていきましょう。ShaderフォルダにHLSLヘッダーファイルを追加してください。

inc_SimpleShader.hlsliの実装は以下の通りです。

SimpleShader_VS.hlslの実装は以下の通りです。

SimpleShader_PS.hlslの実装は以下の通りです。

ここまで実装出来たら一度実行してみてください。
ポリゴンにUV値がしっかり入っていれば大丈夫です。

DirectXTex

テクスチャの読み込みにDirectXTexライブラリを使用するので、前回と同様にメニューからツール→Nugetパッケージマネージャー→ソリューションのNugetパッケージの管理をクリック
検索で「DirectXTex」→directxtex_uwp→プロジェクトのチェックボックスをクリック→インストールをお願いします。

Pch.hにDirectXTexのインクルードをしてください。
※ここでエラーが出る場合はライブラリのインストールに失敗しています。

CBVSRVUAVHeap

テクスチャにはShaderResourceが必要です。と言うことはビューも必要です。ビューが必要と言うことはディスクリプタヒープも必要ですよね？この間はRTVHeapを作成しましたが、今回はCBV・SRV・UAVを管理するHeapを作成していきます。それに伴って共通で使いそうな機能は基底クラスで実装してあげましょう。RTVHeapフォルダは一度削除してソリューションから解放しましょう。Graphicsフォルダ以下にHeapフォルダを作成→hを追加→Heapフォルダ以下にRTVHeapとCBVSRVUAVHeapを追加しcpp/hを追加してください。