# DirectXTK関連（頂点情報）

# 🎯 DirectXTK の主要な頂点構造体一覧（VertexTypes.h）

<table id="bkmrk-%E6%A7%8B%E9%80%A0%E4%BD%93%E5%90%8D%E5%90%AB%E3%81%BE%E3%82%8C%E3%82%8B%E8%A6%81%E7%B4%A0%E3%82%BB%E3%83%9E%E3%83%B3%E3%83%86%E3%82%A3%E3%82%AF%E4%B8%BB%E3%81%AA%E7%94%A8%E9%80%94"><colgroup><col style="width: 156px;"></col><col></col><col style="width: 146px;"></col><col style="width: 195px;"></col><col></col></colgroup><tbody><tr><th>構造体名

</th><th>含まれる要素

</th><th>セマンティクス

</th><th>主な用途

</th><th>備考

</th></tr><tr><td>****VertexPosition****

</td><td>位置

</td><td>`<span class="editor-theme-code">POSITION</span>`

</td><td>最小構成（点・線など）

</td><td><span style="white-space: pre-wrap;">シェーダで </span>

`<span class="editor-theme-code">SV_Position</span>`

<span style="white-space: pre-wrap;"> だけ使う場合</span>

</td></tr><tr><td>****VertexPositionColor****

</td><td>位置＋頂点色

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">COLOR</span>`

</td><td>頂点ごとに色を持つラインやデバッグ描画

</td><td>2D線やワイヤーフレーム表示向き

</td></tr><tr><td>****VertexPositionTexture****

</td><td>位置＋UV

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD</span>`

</td><td>テクスチャ貼り付け（Quad, Billboard, Sprite3Dなど）

</td><td>✅ 最も汎用的で、現在あなたが使っている構成

</td></tr><tr><td>****VertexPositionNormal****

</td><td>位置＋法線

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">NORMAL</span>`

</td><td>照明（ライティング）を行う3Dメッシュ

</td><td>影・陰影処理に使う基本形

</td></tr><tr><td>****VertexPositionNormalColor****

</td><td>位置＋法線＋頂点色

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">NORMAL</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">COLOR</span>`

</td><td>頂点色と照明を併用する場合

</td><td>ゲームモデルなどでよく使われる

</td></tr><tr><td>****VertexPositionNormalTexture****

</td><td>位置＋法線＋UV

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">NORMAL</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD</span>`

</td><td>ライティング＋テクスチャ

</td><td>✅ モデル描画で最も一般的

</td></tr><tr><td>****VertexPositionColorTexture****

</td><td>位置＋色＋UV

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">COLOR</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD</span>`

</td><td>色つきUI・デカールなど

</td><td>色とテクスチャを混ぜたいとき

</td></tr><tr><td>****VertexPositionNormalTangentTexture****

</td><td>位置＋法線＋接線＋UV

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">NORMAL</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TANGENT</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD</span>`

</td><td>法線マップ（ノーマルマップ）を使う高品質シェーディング

</td><td>⚙️ 高級ライティング用

</td></tr><tr><td>****VertexPositionDualTexture****

</td><td>位置＋UV×2

</td><td>`<span class="editor-theme-code">POSITION</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD0</span>`

<span style="white-space: pre-wrap;">, </span>

`<span class="editor-theme-code">TEXCOORD1</span>`

</td><td>マルチテクスチャ合成

</td><td>例：ライトマップ＋ディフューズ

</td></tr></tbody></table>

---

# 🧩 それぞれの使い分け方（実例つき）

## 1️⃣ VertexPositionTexture

```cpp
VertexPositionTexture v[] = {
    { { -1,  1, 0 }, { 0, 0 } },
    { {  1,  1, 0 }, { 1, 0 } },
    { {  1, -1, 0 }, { 1, 1 } },
    { { -1, -1, 0 }, { 0, 1 } },
};
```

<span style="white-space: pre-wrap;">→ </span>****Quadや2Dスプライト****、UI表示などに最適。  
`<span class="editor-theme-code">BasicEffect</span>`<span style="white-space: pre-wrap;"> と組み合わせると、</span>`<span class="editor-theme-code">SetTextureEnabled(true)</span>`<span style="white-space: pre-wrap;"> で完結。</span>

---

## 2️⃣ VertexPositionNormalTexture

```cpp
VertexPositionNormalTexture v[] = {
    { {0,1,0}, {0,1,0}, {0,0} },
    { {1,0,0}, {0,1,0}, {1,1} },
    ...
};
```

<span style="white-space: pre-wrap;">→ </span>****ライトを当てたい3Dモデル****や FBX などで使う。  
`<span class="editor-theme-code">BasicEffect::SetLightingEnabled(true)</span>`<span style="white-space: pre-wrap;"> を使えば、方向光・点光源も一瞬で追加できる。</span>

---

## 3️⃣ VertexPositionNormalTangentTexture

```cpp
VertexPositionNormalTangentTexture v[] = {
    { pos, normal, tangent, uv },
};
```

<span style="white-space: pre-wrap;">→ </span>****ノーマルマップ対応モデル****用。  
<span style="white-space: pre-wrap;">DirectXTK の </span>`<span class="editor-theme-code">SkinnedEffect</span>`<span style="white-space: pre-wrap;"> や </span>`<span class="editor-theme-code">NormalMapEffect</span>`<span style="white-space: pre-wrap;"> と組み合わせると最短で使える。</span>

---

## 4️⃣ VertexPositionColor

```cpp
VertexPositionColor v[] = {
    { {0,0,0}, Colors::Red },
    { {1,0,0}, Colors::Green },
};
```

<span style="white-space: pre-wrap;">→ </span>****デバッグ線・グリッド表示****・ワイヤーフレーム描画など。  
`<span class="editor-theme-code">BasicEffect</span>`<span style="white-space: pre-wrap;"> の </span>`<span class="editor-theme-code">SetVertexColorEnabled(true)</span>`<span style="white-space: pre-wrap;"> をオンにすれば、色付き描画可能。</span>

---

# ⚙️ 裏側の仕組み（共通点）

DirectXTK の各頂点構造体は以下のような定義を持っています：

```cpp
struct VertexPositionTexture
{
    DirectX::XMFLOAT3 position;
    DirectX::XMFLOAT2 textureCoordinate;

    static const D3D11_INPUT_ELEMENT_DESC InputElements[2];
    static const UINT InputElementCount = 2;
};
```

`<span class="editor-theme-code">InputElements</span>`<span style="white-space: pre-wrap;"> の定義はライブラリ内にあり、</span>  
`<span class="editor-theme-code">BasicEffect</span>`<span style="white-space: pre-wrap;"> や </span>`<span class="editor-theme-code">CreateInputLayout()</span>`<span style="white-space: pre-wrap;"> にそのまま渡せます：</span>

```cpp
m_device->CreateInputLayout(
    VertexPositionTexture::InputElements,
    VertexPositionTexture::InputElementCount,
    bytecode, bytecodeLength,
    m_inputLayout.ReleaseAndGetAddressOf());
```

> 👉 自分で D3D11\_INPUT\_ELEMENT\_DESC を書かなくてよくなる！

---

# 💡 他のEffectとの対応

<table id="bkmrk-effect%E3%82%AF%E3%83%A9%E3%82%B9%E5%AF%BE%E5%BF%9C%E3%81%99%E3%82%8B%E9%A0%82%E7%82%B9%E6%A7%8B%E9%80%A0%E4%BD%93ba"><colgroup><col></col><col></col></colgroup><tbody><tr><th>Effectクラス

</th><th>対応する頂点構造体

</th></tr><tr><td>****BasicEffect****

</td><td>VertexPosition, VertexPositionColor, VertexPositionTexture, VertexPositionNormalTexture

</td></tr><tr><td>****SkinnedEffect****

</td><td>VertexPositionNormalTexture（＋ボーン情報）

</td></tr><tr><td>****NormalMapEffect****

</td><td>VertexPositionNormalTangentTexture

</td></tr><tr><td>****EnvironmentMapEffect****

</td><td>VertexPositionNormalTexture

</td></tr><tr><td>****DualTextureEffect****

</td><td>VertexPositionDualTexture

</td></tr><tr><td>****AlphaTestEffect****

</td><td>VertexPositionTexture（アルファテスト付きPS）

</td></tr></tbody></table>

> 各 Effect は自分が想定している頂点構造に合わせて内部シェーダを持っています。  
> <span style="white-space: pre-wrap;">つまり、構造体を正しく選ぶだけで </span>`<span class="editor-theme-code">InputLayout</span>`<span style="white-space: pre-wrap;"> とシェーダの整合性が取れる。</span>

---

# 🧭 まとめ

<table id="bkmrk-%E7%9B%AE%E7%9A%84%E9%A0%82%E7%82%B9%E6%A7%8B%E9%80%A0%E4%BD%93%E4%BD%BF%E7%94%A8%E3%81%99%E3%82%8B-effect%E3%82%B7%E3%83%B3"><colgroup><col></col><col></col><col></col></colgroup><tbody><tr><th>目的

</th><th>頂点構造体

</th><th>使用する Effect

</th></tr><tr><td>シンプルなテクスチャ付き板ポリ

</td><td>VertexPositionTexture

</td><td>BasicEffect

</td></tr><tr><td>光を当てたい3Dモデル

</td><td>VertexPositionNormalTexture

</td><td>BasicEffect

</td></tr><tr><td>ノーマルマップ付き高品質モデル

</td><td>VertexPositionNormalTangentTexture

</td><td>NormalMapEffect

</td></tr><tr><td>色付きライン・ワイヤー

</td><td>VertexPositionColor

</td><td>BasicEffect

</td></tr><tr><td>2枚テクスチャ合成

</td><td>VertexPositionDualTexture

</td><td>DualTextureEffect

</td></tr></tbody></table>

---