3D Графика для Windows Phone 7 с использованием XNA Framework. Часть 1

Введение

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

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

В рамках данной статьи мы рассмотрим технологию Microsoft XNA Framework, которая позволяет разрабатывать приложения, поддерживающие трехмерную графику, для новых телефонов, основанных на Windows Phone 7.

Начало работы

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

Как говорилось ранее, для работы с трехмерной графикой для Windows Phone 7 мы будем использовать XNA Framework 4. Разработка будет вестись в привычной для .NET разработчиков среде Visual Studio 2010 с дополнительной надстройкой Windows Phone Developer Tools для XNA Framework.

Системные требования Windows Phone Developer Tools для XNA Framework подробно описаны в (http://download.microsoft.com/download/1/7/7/177D6AF8-17FA-40E7-AB53-00B7CED31729/Release%20Notes%20-%20WPDT%20RTM.htm), здесь же будут описаны основные положения:

Операционная система:

Windows Vista SP2 (кроме редакции Starter), Windows 7 (кроме редакции Starter)

Примечание:

Разрабатывать приложения для Windows и Xbox 360 можно с использованием XNA Framework 4 и в Windows XP, однако разрабатывать приложения для Windows Phone 7 можно только в Windows Vista/7.

Железо:

Для работы эмулятора Windows Phone требуется видео-карта с поддержкой DirectX 10.1.

Примечание:

Информацию о своей видеокарте вы можете получить на сайте производителя.

Также рекомендуется обновить драйверы для видеокарты.

Если видеокарта поддерживает DirectX 10.1 и все настроено правильно, то зайдя в DirectX Caps Viewer (входит в состав DirectX SDK) в разделе DXGI 1.1 Devices\[Название вашей видеокарты] вы найдете подраздел Direct3D 10.1.

Если компьютер удовлетворяет всем описанным требованиям, то можно переходить к этапу установки инструментов для разработки.

Установите последнюю версию DirectX SDK.

Установите Windows Phone Developer Tools. (http://create.msdn.com/en-us/resources/downloads)

Теперь в Visual Studio создайте новый проект Windows Phone Game (4.0) из раздела XNA Game Studio 4.0.

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

Примечание:

Для того, чтобы сократить время следующего запуска приложения нужно не закрывать эмулятор, а просто остановить отладку приложения в Visual Studio.

Приступаем к работе. Основы XNA Framework

XNA Framework позволяет разрабатывать приложения для платформ Windows, Xbox 360 и Windows Phone 7. Причем эта технология специально создана таким образом, чтобы сделать разработку приложений под различные платформы максимально простой и удобной.

Следующая схема описывает принцип работы XNA Framework:

XNA Framework для Windows базируется на .NET Framework[] и на .NET Compact Framework[] для Xbox 360 и Windows Phone 7. Разработка ведется в Visual Studio 2010, для этих целей существует надстройка XNA Game Studio, которая добавляет в Visual Studio новые элементы, такие как шаблоны проектов XNA Framework.

На следующем рисунке показаны основные элементы XNA Framework.

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

Extended Framework состоит из Application Model и Content Pipeline.

Application Model – каркас приложения. Каждый новый проект XNA Game уже содержит в себе класс Game1, которые имеет набор методов, каждый из которых имеет свое предназначение. Разработчику не нужно задумываться над такими вопросами как:

Как создать игровой цикл?

Когда обрабатывать пользовательский ввод?

Когда формировать изображение на экране?

Следующая схема описывается последовательность вызовов методов каркаса приложения:

Content Pipeline – средство, которое унифицирует работу с игровыми ресурсами (текстуры, модели, музыка и т.д.). Все игровые ресурсы помещаются в единое хранилище, а их обработкой занимаются заранее подготовленные импортеры. Таким образом, разработчику не нужно тратить свое время на создание классов, которые бы загружали ресурсы в игру.

Основы трехмерной компьютерной графики

На мой взгляд, программирование 3D графики – это очень сложная и комплексная задача, так что еще до того как приступать к программированию Вашего первого приложения, использующего трехмерную графику, Вам нужно хорошо осознать основы работы с трехмерной компьютерной графикой.

В этой части статьи находится очень краткое введение в трехмерную графику.

Замечание:

Я очень рекомендую Вам почитать книги и статьи о трехмерной графике, перед тем как начинать работать над собственным проектом, этот обзор дает лишь общее представление, которое необходим для понимания оставшейся части статьи.

Если Вы хорошо разбираетесь в трехмерной графике, то можете пропустить эту часть и переходить к следующей главе.

Системы координат

Первое, что стоит отметить – это то, что практически вся современная трехмерная компьютерная графика – это полигональная графика. Это означает, что все модели состоят из полигонов (обычно из треугольников), которые в свою очередь состоят из вершин.

Это вершин позиционированы в трехмерной системе координат.

Различают две системы координат: левостороннюю (в которой ось Z направлена в направлении от наблюдателя, когда ось Y направлена вверх, а ось X направлена вправо) и правостороннюю (когда ось Z направлена к наблюдателю)

Замечание:

XNA Framework использует только правостороннюю систему координат

Вершинные операции

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

Например, если Вы хотите передвинуть точку на (dx1,dy1,dz1), потом повернуть на угол A относительно оси X, а потом переметить на (dx2,dy2,dz2), то Вы должны помножить оригинальную позицию точки (в векторном виде) на матрицу Перемещения, затем на матрицу Поворота, затем снова на матрицу Перемещения.

Замечание:

Обратите внимание на то, чтобы выполнять это операции в правильно порядке в матричной форме. Умножение матриц является некоммутативной операцией.

Вот как это может выглядеть в XNA Framework:

            Vector3 position = new Vector3(x, y, z);
Matrix transformationMatrix = Matrix.CreateTranslation(dx1, dy1, dz1) * Matrix.CreateRotationX(a) * Matrix.CreateTranslation(dx2, dy2, dz2);
Vector3 newPosition = Vector3.Transform(position, transformationMatrix);

На самом деле, практически все нужные операции могут быть описаны матрицами перемещения, поворота и масштабирования.

Основная задача трехмерной компьютерной графики

Теперь, имея некоторые базовые знания в области трехмерной графики, можно переходить к основной задаче трехмерной компьютерной графики.

Как нам создать наш большой трехмерный мир, а потом отобразить его на двухмерном экране монитора.

Если говорить совсем кратко, то это делается следующим образом: поместить каждую модель в нужное место трехмерного мира, поставить виртуальную камеру куда-нибудь в этот мир и наконец, спроецировать все, что попало в область обзора камеры на экран монитора.

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

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

Вот так выглядит локальная система координат:

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

Это делается путем умножения координат модели на Мировую матрицу (World Matrix).

Когда каждая вершина помещена в задуманную позицию, нам нужно решить какую часть нашего мира нужно нарисовать на экране. Обычно мы знаем виртуальную позицию игрока в игровом мире, так что мы размещаем виртуальную камеру в этом месте.

Виртуальная камера описывается своей позицией, направлением и ориентацией.

Так мы подошли к системе координат камеры.

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

В XNA Framework Матрица Вида создается из следующих параметров: позиция камеры, точка, в которую направлена камера и вектор, направленный вверх относительно направления обзора камеры (ориентация камеры).

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

Далее, все, что попало в усеченную пирамиду обзора, проецируется на плоскости проекции. Это делается при помощи умножения координат (в системе координат камеры) на Матрицу Проекции (Projection Matrix).

Замечание:

Матрица проекции немного более сложна, чем матрица вида и мировая матрица. Тут я не буду объяснять это в деталях, единственная вещь, которую я хочу отметить, это то, что матрица перспективной проекции в XNA Framework может быть создана из следующих параметров: угол обзора, коэффициент пропорциональности и дистанция до ближней и дальней плоскостей отсечения.

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

Обобщим вышесказанное: позиция трехмерной вершины на двухмерном экране может быть получена последовательным умножением ее позиции в локальной системе координат на Мировую Матрицу, Матрицу Вида и Матрицу Проекции.

Основные принципы 3D графики в XNA Framework

Перейдем теперь к рассмотрению базовых принципов работы с трехмерной графикой в XNA Framework.

Сначала загрузим модель чайника в приложение.

Как уже говорилось ранее, за обработку ресурсов и их загрузку в приложение отвечает Content Pipeline.

В четвертой версии XNA Framework появился новый тип проекта – Content Project. Именно его мы видим в Solution Explorer при создании нового проекта Windows Phone Game.

Добавляем подготовленную модель (Add->Existing Item)в проект. Сейчас мы не будем обращать внимание на настройки Content Processor и Content Importer, которые доступны в панели свойств, для только что добавленной модели. XNA Game Studio самостоятельно подберет подходящий обработчик для модели, нам остается только ассоциировать с ней некоторую переменную и отобразить модель на экране.

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

Model model;

        protected override void LoadContent()
        {
            spriteBatch = new SpriteBatch(GraphicsDevice);

            model = Content.Load<Model>("teapot");
        }

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

 
        protected override void Initialize()
        {

            this.graphics.PreferredBackBufferHeight = 800;
            this.graphics.PreferredBackBufferWidth = 480;
            base.Initialize();
        }

Теперь при вертикальном положении эмулятора ось Y в трехмерном пространстве будет направлена вверх.

Переходим к рисованию модели:

 
        protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.CornflowerBlue);

            Matrix world = Matrix.CreateRotationY((float)gameTime.TotalGameTime.TotalSeconds);
            Matrix view = Matrix.CreateLookAt(new Vector3(0,0,2), Vector3.Zero, Vector3.Up);
            Matrix projection = Matrix.CreatePerspectiveFieldOfView(MathHelper.ToRadians(45), GraphicsDevice.Viewport.AspectRatio, 0.1f, 10f);
            model.Draw(world, view, projection);

            base.Draw(gameTime);
        }

Рассмотрим более подробно созданный код:

Первая строка метода Draw просто очищает буфер кадра, закрашивая его голубым цветом.

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

Дальше задается матрица вида. Камера немного отдаляется от начала координат в направлении наблюдателя и направлена в начало координат.

В следующей строке задается матрица проекции. Заданы достаточно стандартные значения: угол обзора в 45 градусов, коэффициент пропорциональности получается при помощи свойства текущего ViewPort. Расстояния до ближней и дальней плоскости отсечения заданы такими образом, чтобы модель попадала в область обзора.

После создания трех матриц вызывается метод Draw модели, при помощи которого осуществляет рендеринг модели на экран.

Запустив приложение, мы увидим следующую картинку на экране эмулятора.

Меняем

        protected override void Draw(GameTime gameTime)
{
GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

Matrix world = Matrix.CreateRotationY((float)gameTime.TotalGameTime.TotalSeconds)
Matrix.CreateTranslation(0,-0.4f,0);
Matrix view = Matrix.CreateLookAt(new Vector3(0,0,1.2f), Vector3.Zero, Vector3.Up);
Matrix projection = Matrix.CreatePerspectiveFieldOfView(MathHelper.ToRadians(45), GraphicsDevice.Viewport.AspectRatio, 0.1f, 10f);

model.Draw(world, view, projection);

base.Draw(gameTime);
}

Получаем:

Реклама
Запись опубликована в рубрике Компьютерная графика с метками , , , , , , . Добавьте в закладки постоянную ссылку.

5 комментариев на «3D Графика для Windows Phone 7 с использованием XNA Framework. Часть 1»

  1. Уведомление:   Windows Phone / Возможности 3D графики Windows Phone by SOS Admin!

  2. Отличная серия статей. Спасибо

  3. M:

    В разделе «Системы координат» описание левосторонней и правосторонней не соответствуют приведенным на рисунке. На рисунке в левосторонней ось z направлена ОТ наблюдателя.

  4. Уведомление: Pirau Vladislav » 3D для Windows Phone

Добавить комментарий

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s