2D в Direct3D с помощью текстурированных четырехугольников

Эта статья для людей, которые пытаются создать 2D графический движок, используя Direct3D 9. Это означает, что вы уже писали простейшие Direct3D 9 приложения и запускали их, возможно, использовали функции ID3DXSprite.

Даже если вы в коде для полноценного рабочего приложения не использовали методы, описываемые в этой статье.

В этой статье следующие разделы:

Концепция

Формат вершин

Код инициализации

Загрузка текстур

Рисование текстуры

Класс CTexture

1. Концепция

Допустим, вы решили написать 2D-игру. Превосходно, Мне нравятся 2D-игры. Вы также решили использовать Direct3D в качестве API. Отлично, вам нужны такие интересные трюки, как полная поддержка железом альфа-смешивания. Если вы используете Direct3D 8, кода будет больше (уже изменение всех функций 8-й версии на 9-ю и обновление вызовов CreateVertexBuffer() и SetStreamSource()). Теперь вы совсем удивитесь "Как я вообще смогу вывести двумерную графику на экран, используя API, разработанный исключительно для 3D графики?"

Не волнуйтесь. Это отчасти несложно. В любом случае, вы только хотели попробовать написать код ;-)

Основная идея заключается в рисовании прямоугольника на экране, текстурированного вашим 2D изображением. Заметим, что изображение может иметь свой собственный альфа-канал, поэтому не забудьте придать прозрачности прямоугольной рамке вокруг вашего изображения (например, используя выделение ключевого цвета) и в то же время вы можете сделать некоторые области изображения частично прозрачными.

Перед тем, как нарисовать четырехугольник на экране, вам следует задать координаты 4-х вершин четырехугольника. Это означает, что если вы немного поиграетесь с координатами, то сможете просто добавить такие преобразования, как наклон и перспективу. Как бы то ни было, это останется в качестве упражнения для читателя.

Как бы то ни было, преимущество использования текстурированных четырехугольников для 2D-движка в скорости. Вы обычно используете 3D железо в точности для того, для чего оно было спроектировано:

Конечно, так много преимуществ при использовании текстурированных четырехугольников, что должно быть несколько проблем. И вот некоторые.

Самый известный способ отображения заключается в том, чтобы использовать 3D железо для рисования. Это потому, что большинство 3D карт не поддерживают текстуры со размером стороны, не являющимся степенью 2. Далее, некоторые карты не могу поддерживать неквадратные текстуры. Это означает, что вам следует использовать для графики такие размерности, как 1x1, 2x2, 4x4, 8x8, 16x16, 32x32, 64x64, 128x128 и т.д. Максимальный размер, который вам следует использовать - 512х512. Большинство видеократ могут поддерживать текстры размеров вплоть до 2048х2048, но некоторые не могут, да и текстура большого размера потребует большого объема памяти видекокарты.

Класс CTexture, который Я описываю в конце этой статьи, предоставит возможность обхода этих ограничений, позволяя вам использовать прямоугольные текстуры произвольного размера. Даже в этом случае, используя неквадратные, не в-степени-2 текстуры намного лучше гарантируют результат в более загруженное время и при большей загруженности памяти.

2. Формат вершин

Наступило время приступить к делу: положить четырехугольник на экран.

Каждый четырехугольник состоит из двух треугольников и четырех вершин, как показано ниже:

-

-

-

-

-

-

-

-

-

-

-

-

Мне нравится приводить эту частичную диаграмму в качестве комментария к моему коду, это удобно если я желаю изменить цвет части угла нарисованного мною четырехугольника (об этом читайте дальше).

Во-первых, вам нужно написать свой движок, базирующийся на четырехугольниках и для 2D рисования, как гибкий формат вершин. Формат вершин гарантирует, что информация, доступна вершинам, которые включает нарисованный вами четырехугольник. Это единственное, что вам следует хорошо сделать:

const DWORD D3DFVF_TLVERTEX = D3DFVF_XYZRHW | D3DFVF_DIFFUSE | D3DFVF_TEX1;

Поместите это где-либо, где находится код всей вашей графики. Это очень важно.

Быстро пробежимся по каждому из флагов формата вершин и узнаем назначение каждого:

D3DFVF_XYZRHW - определяет, информацию о позициях вершин. Таким образом, координаты X, Y, Z так же подходят, как и "эквивалентность координаты W". Все, что вам реально нужно знать об этом - она позволяет вам использовать координаты экрана для того, чтобы рисовать ваши четырехугольники, не используя при этом координат трехмерного пространства. Как вы можете заметить, координата Z является лишней. Она всегда будет устанавливаться в 0.

D3DFVF_DIFFUSE - позволяет вам указать цвет и альфа-канал для вершины, позволяя вам окрашивать углы четырехугольника в разные цвета. ID3DXSprite имеет ограниченную поддержку этого, позволяя вам окрасить весь четырехугольник в определенный цвет. Код в этой статье позволит вам изменить цвет и альфа-значение для каждого угла четырехугольника.

D3DFVF_TEX1 - определяет, что вершина будет содержить координаты текстуры. Это нужно вам для того, чтобы положить текстуру на нарисованный вами четырехугольник.

Теперь, когда вы определили ваш формат вершин, вам нужна структура для хранения вершин. Вот это будет работать превосходно для вышеупомянутого формата вершин:

//Определенные вершины

struct TLVERTEX

{

float x;

float y;

float z;

float rhw;

D3DCOLOR colour;

float u;

float v;

};

Вам понадобится сделать эту структуру хорошо доступной для всего вашего кода рисования графики.

Ознакомительное описание членов:

x, y, z - просто координаты вершины. х и у - как обычно, координаты вершины на экране. В плоскости координата z всегда 0.0f. Пока х и у дробные, они должны содержать интегральные значения, иначе они будут округлены в момент рисования четырехугольника.

rhw - всегда 0.0f. Это позволяет вам использовать координаты экрана для определения позиции вершины, что лучше, чем в 3D координатах,

colour - цвет/альфа-значение вершины в стандартном формате AARRGGBB.

u, v - координаты текстуры для вершины. Для всех вертикалей слева u = 0.0f. Справа: u =1.0f. Вверху: v = 0.0f. Внизу: v = 1.0f.

Вам не следует запоминать все это, не волнуйтесь. В зависимости от того, как долго вы обычно копируете и вставляете константы и структуры, у вас не будет проблем с использованием кода, описанного в этой статье;)

3. Код инициализации

Как бы то ни было, вы получили объект Direct3D, объявили свои параметры, создали свое устройство. Все, что вам сейчас нужно - добавить пару линий и вы сможете рисовать текстуризированные четырехугольники в отсутствие времени.

Во-первых, вам нужно создать буффер вершин. В той же сборке, где находится ваш указатель IDirect3DDevice9, добавьте:

IDirect3DVertexBuffer9* vertexBuffer;

Превосходно. Сейчас в вашей инициализирующей функции, ПОСЛЕ создания устройства, добавьте следующее:

//Установить шейдер вершин

DEVICE->SetVertexShader(NULL);

DEVICE->SetFVF(D3DFVF_TLVERTEX);

//Создат вершинный буфер

DEVICE->CreateVertexBuffer(sizeof(TLVERTEX) * 4, NULL,

D3DFVF_TLVERTEX, D3DPOOL_MANAGED, &vertexBuffer, NULL);

DEVICE->SetStreamSource(0, vertexBuffer, 0, sizeof(TLVERTEX));

Замечание 1: Замените DEVICE именем вашего IDirect3DDevice9* object

Замечание 2: Этот код не должен идти сразу после вызова CreateDevice(); как устройство должно хорошо работать не зависимо от времени создания

Также следующие состояния рендеринга следует установить, если они не установлены:

DEVICE->SetRenderState(D3DRS_LIGHTING, FALSE);

DEVICE->SetRenderState(D3DRS_ALPHABLENDENABLE, TRUE);

DEVICE->SetRenderState(D3DRS_SRCBLEND, D3DBLEND_SRCALPHA);

DEVICE->SetRenderState(D3DRS_DESTBLEND, D3DBLEND_INVSRCALPHA);

DEVICE->SetTextureStageState(0, D3DTSS_ALPHAOP, D3DTOP_MODULATE);

Замечание: Замените DEVICE именем вашего IDirect3DDevice9* object

Хорошо, теперь мы можем двигаться дальше. Давайте загрузим несколько текстур.

4. Загрузка текстуры

Использовать D3DX необычайно просто. Вот фрагмент кода:

//Загрузка текстуры из файла с помощью D3DX

//Поддерживаемые форматы: BMP, PPM, DDS, JPG, PNG, TGA, DIB

IDirect3DTexture9 *LoadTexture(char *fileName)

{

IDirect3DTexture9 *d3dTexture;

D3DXIMAGE_INFO SrcInfo; //Необязательно

//В качестве ключевого цвета использовать малиновый

D3DCOLOR colorkey = 0xFFFF00FF;

//Загрузить картинку из файла

if (FAILED(D3DXCreateTextureFromFileEx (DEVICE, fileName, 0, 0, 1, 0,

D3DFMT_A8R8G8B8, D3DPOOL_MANAGED, D3DX_FILTER_NONE, D3DX_DEFAULT,

colorkey, &SrcInfo, NULL, &d3dTexture)))

{

return NULL;

}

//Возвратить только что созданную текстуру