3 d графика в silverlight 5 beta

Microsoft TechDayshttp://www.techdays.ru

3D графика в Silverlight 5 beta

Виталий ДильмухаметовOogway software


Основы 3D3 координаты точки – (X,Y,Z)В Silverlight 5 – правосторонняя система координатВектор – задаёт направление и скорость движения

Z

Y

X

K(xk,yk,zk

)

A(xa,ya,za)

B(xb,yb,zb

)

C(xc,yc,zc

)


Основы 3DМодель состоит из полигоновТочка – вершина (vertex)Несколько граней – сетка (mesh)

Вершины

Контуры

Грани Полигоны Поверхности


Матрицы в 3DИмеют вид 4x4Матрица мира:

ПеремещениеВращениеМасштаб

Матрица вида:Управление камерой

Матрица проекции:Настройка проекции 3D на экран


Матрицы в 3DПреобразование модели (координат вершин)

Пространство модели

Пространство мира

Пространство вида

Пространство

проекцииПространство экрана

Матрица мира

Матрица вида

Матрица проекции

Область отображени

я


3D в Silverlight 5Основа – элемент управления DrawingSurface

Отрисовка силами GPUHLSL шейдеры версии 2.0API из XNAВстроенные эффекты (не в beta)

Библиотека XNA Math Helper


Процесс отрисовкиВершинный

шейдерПиксельный

шейдер

• Буфер вершин• Буфер индексов вершин• Матрицы

преобразования• Положение/тип

источника света

• Текстуры


ШейдерыДля написания используется HLSL

Компиляция при помощи FXC из DirectX SDKИспользуется версия 2.0 (поддержка в очень большом спектре GPU)

Вершинные шейдерыРабота с данными вершин

Пиксельные шейдерыОбработка точек результирующего изображения

Шаг 1: Включение 3D

Добавить в HTML:

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" ...> <param name="EnableGPUAcceleration" value="true" />

</object>

Шаг 2: DrawingSurface

Добавить в XAML-разметку:

<Grid x:Name="LayoutRoot" Background="Black"> <DrawingSurface Draw="OnDraw" /></Grid>

Шаг 3: Отрисовка

Обработчик OnDraw()public void OnDraw(Object sender, DrawEventArgs args){ // Очистка поверхности args.GraphicsDevice.Clear(...);

// Собственно отрисовка args.GraphicsDevice.DrawPrimitives(...);

// Объявить о необходимости обновить поверхность // За этим вызовом следует генерирование Draw ещё раз args.InvalidateSurface();}


Простое приложение с 3D-графикой

Демо


Важные моментыВ приложениях c 3D:

UI потокПоток отрисовки 3D (в нём выполняется обработчик Draw)

Из потока отрисовки нельзя обращаться к DependencyProperty!

Использование промежуточной модели данных, блокировки и кэширования

Анимация в 3D – посредством матричных преобразований


Важные моментыСоздание ресурсов (текстур, шейдеров и пр.) – вне обработчика Draw

Для исключения задержек при отрисовкеИспользование GraphicsDeviceManager.Current.GraphicsDevice

Поддержка смешивания цветовSilverlight использует BGRA, XNA – RGBA!

Проверка доступности 3D:GraphicsDeviceManager.Current.RenderMode Событие RenderModeChanged у GraphicsDeviceManager


Немного о будущемНе войдёт в релиз 5 версии:

Content pipeline и работа с моделямиОбработка ввода3D звукПользовательские эффектыСредства упрощения создания игр


Немного о будущемНе вошло в beta и будет добавлено:

Эффекты (BasicEffect, SkinnedEffect, Environment Map и др.)АнтиалиасингРисование на текстуре (render target texture)Управление устройствамиДоп. параметры для DrawingSurface


BabylonГрафический движокОбнаружение столкновенийBasicEffect – освещение и отражение светаАвторы: David Catuhe, Michel Rousseau

URL: http://code.msdn.microsoft.com/Babylon-3D-engine-f0404ace

http://code.msdn.microsoft.com/Babylon-3D-engine-f0404ace

http://code.msdn.microsoft.com/Babylon-3D-engine-f0404ace


3D HousebuilderЧастичная поддержка COLLADAТрансляция 2D координат мыши в 3DMIP-текстурированиеАвторы: Archetype, Inc. (http://www.archetype-inc.com/)URL: http://code.msdn.microsoft.com/3D-Housebuilder-demo-from-def4af04

http://www.archetype-inc.com/

http://www.archetype-inc.com/

http://code.msdn.microsoft.com/3D-Housebuilder-demo-from-def4af04





Silverlight 3D Model Importer Импорт моделей

из популярных форматов с помощью XNAАнимированные моделиОсвещение и текстуры

Автор: Simon FerquelURL: http://sl3dmi.codeplex.com/

http://sl3dmi.codeplex.com/




BalderЕсть alpha-версия под Silverlight 5 betahttp://balder.codeplex.com/

http://balder.codeplex.com/


Примеры с MIX11Набор исходных кодов с демонстраций MIX11, посвященных 3D в Silverlight 5 betaВсе ссылки в блоге Aaron Oneal:

http://aarononeal.info/?p=125




Полезные вещиИнструменты

Autodesk FBX Converter 2012NVidia FX ComposerMicrosoft DirectX SDK

Материалыhttp://xnadev.ruhttp://create.msdn.com

http://xnadev.ru/

http://create.msdn.com/

http://create.msdn.com/

3 d графика в silverlight 5 beta

Documents