Lesson4 Texture

立方体に Texture(bin 形式の画像)を貼り付けます。

前田稔(Maeda Minoru)の超初心者のプログラム入門

プログラムの説明

  1. 立方体に Texture を貼り付けて、回転しながら描画します。
    Main.cpp をダブルクリックして、ソースコードを表示して下さい。
    頂点データの構造体定義です。
    頂点データは三次元座標と法線ベクトルとテクスチャ座標で構成されています。
        struct BasicVertex
        {
            float3 pos;  // position
            float3 norm; // surface normal vector
            float2 tex;  // texture coordinate
        };
        
  2. 立方体の座標定義です。
    BasicVertex を使って、6面の頂点座標と法線ベクトルとテクスチャ座標を定義しています。
        virtual void Run()
        {
            ・・・
        BasicVertex cubeVertices[] =
        {
            // +Y (top face)
            { float3(-0.5f, 0.5f, -0.5f), float3(0.0f, 1.0f, 0.0f), float2(0.0f, 0.0f) },
            { float3( 0.5f, 0.5f, -0.5f), float3(0.0f, 1.0f, 0.0f), float2(1.0f, 0.0f) },
            { float3( 0.5f, 0.5f,  0.5f), float3(0.0f, 1.0f, 0.0f), float2(1.0f, 1.0f) },
            { float3(-0.5f, 0.5f,  0.5f), float3(0.0f, 1.0f, 0.0f), float2(0.0f, 1.0f) },
            // -Y (bottom face)
            { float3(-0.5f, -0.5f,  0.5f), float3(0.0f, -1.0f, 0.0f), float2(0.0f, 0.0f) }, 
            { float3( 0.5f, -0.5f,  0.5f), float3(0.0f, -1.0f, 0.0f), float2(1.0f, 0.0f) },
            { float3( 0.5f, -0.5f, -0.5f), float3(0.0f, -1.0f, 0.0f), float2(1.0f, 1.0f) },
            { float3(-0.5f, -0.5f, -0.5f), float3(0.0f, -1.0f, 0.0f), float2(0.0f, 1.0f) },
            // +X (right face)
            { float3(0.5f,  0.5f,  0.5f), float3(1.0f, 0.0f, 0.0f), float2(0.0f, 0.0f) }, 
            { float3(0.5f,  0.5f, -0.5f), float3(1.0f, 0.0f, 0.0f), float2(1.0f, 0.0f) },
            { float3(0.5f, -0.5f, -0.5f), float3(1.0f, 0.0f, 0.0f), float2(1.0f, 1.0f) },
            { float3(0.5f, -0.5f,  0.5f), float3(1.0f, 0.0f, 0.0f), float2(0.0f, 1.0f) },
            // -X (left face)
            { float3(-0.5f,  0.5f, -0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.0f, 0.0f) }, 
            { float3(-0.5f,  0.5f,  0.5f), float3(-1.0f, 0.0f, 0.0f), float2(1.0f, 0.0f) },
            { float3(-0.5f, -0.5f,  0.5f), float3(-1.0f, 0.0f, 0.0f), float2(1.0f, 1.0f) },
            { float3(-0.5f, -0.5f, -0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.0f, 1.0f) },
            // +Z (front face)
            { float3(-0.5f,  0.5f, 0.5f), float3(0.0f, 0.0f, 1.0f), float2(0.0f, 0.0f) }, 
            { float3( 0.5f,  0.5f, 0.5f), float3(0.0f, 0.0f, 1.0f), float2(1.0f, 0.0f) },
            { float3( 0.5f, -0.5f, 0.5f), float3(0.0f, 0.0f, 1.0f), float2(1.0f, 1.0f) },
            { float3(-0.5f, -0.5f, 0.5f), float3(0.0f, 0.0f, 1.0f), float2(0.0f, 1.0f) },
            // -Z (back face)
            { float3( 0.5f,  0.5f, -0.5f), float3(0.0f, 0.0f, -1.0f), float2(0.0f, 0.0f) }, 
            { float3(-0.5f,  0.5f, -0.5f), float3(0.0f, 0.0f, -1.0f), float2(1.0f, 0.0f) },
            { float3(-0.5f, -0.5f, -0.5f), float3(0.0f, 0.0f, -1.0f), float2(1.0f, 1.0f) },
            { float3( 0.5f, -0.5f, -0.5f), float3(0.0f, 0.0f, -1.0f), float2(0.0f, 1.0f) },
        };
        
  3. 頂点データを組み合わせて、三角形ポリゴンで立方体のモデルを定義します。
    立方体の各面は、二個の三角形ポリゴンで構成します。
        unsigned short cubeIndices[] =
        {
            0, 1, 2,    0, 2, 3,
            4, 5, 6,    4, 6, 7,
            8, 9, 10,    8, 10, 11,
            12, 13, 14,    12, 14, 15,
            16, 17, 18,    16, 18, 19,
            20, 21, 22,    20, 22, 23
        };
        
  4. X方向のテクスチャ座標を変更してみました。
    right face は 1.0f⇒2.0f に、left face は 1.0f⇒0.5f に修正します。
        // +X (right face)
        { float3(0.5f,  0.5f,  0.5f), float3(1.0f, 0.0f, 0.0f), float2(0.0f, 0.0f) },
        { float3(0.5f,  0.5f, -0.5f), float3(1.0f, 0.0f, 0.0f), float2(2.0f, 0.0f) },
        { float3(0.5f, -0.5f, -0.5f), float3(1.0f, 0.0f, 0.0f), float2(2.0f, 2.0f) },
        { float3(0.5f, -0.5f,  0.5f), float3(1.0f, 0.0f, 0.0f), float2(0.0f, 2.0f) },
        // -X (left face)
        { float3(-0.5f,  0.5f, -0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.0f, 0.0f) }, 
        { float3(-0.5f,  0.5f,  0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.5f, 0.0f) },
        { float3(-0.5f, -0.5f,  0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.5f, 0.5f) },
        { float3(-0.5f, -0.5f, -0.5f), float3(-1.0f, 0.0f, 0.0f), float2(0.0f, 0.5f) },
        
  5. "texturedata.bin" は、画像を DirectX の内部イメージ形式に変換したデータ?のようです。
    テクスチャ画像の設定は結構面倒で、Lesson4 では内部イメージ形式に変換したデータを直接 BasicReaderWriter で入力しているようです。
    画像ファイルを入力してテクスチャを設定する方法は Lesson5 を参照して下さい。
        virtual void Run()
        {
            BasicReaderWriter^ reader = ref new BasicReaderWriter();
            ・・・
            auto textureData = reader->ReadData("texturedata.bin");
            D3D11_SUBRESOURCE_DATA textureSubresourceData = {0};
            textureSubresourceData.pSysMem = textureData->Data;
        

超初心者のプログラム入門(DirectX Store)