 Данная статья открывает цикл из двух (а может быть и трех) материалов по смешиванию — блендингу — в OpenGL. Сам эффект достаточно прост, но с ним связано немало тонкостей.
Я помню, как первый раз включил в код смешивание. Алгоритм писал не сам, но результат все равно потряс. Это было на SGL Indigo II с графической платой GR3-Elan (те, кому доводилось видеть SGI Indigo или прочие графические станции 90-х, знают, какого размера были на них графические платы!). Вычислительные мощности системы того времени составляли буквально доли от Мака, на котором я работаю сейчас, но тогда это было по-настоящему впечатляюще!
Момент был особенно волнующим, еще и потому, что в то время никто из нас не сталкивался со смешиванием в реальном времени на объектах с наложенными текстурами, перемещениями в сцене и эффектами освещения. Само собой, все это встречалось в LightWave и другом ПО с имитацией эффектов света, но о реальном времени речь не шла. Да… В то время программированием занимались, чтобы выдать нечто новое и необычное, а не чтобы через пару дней выпустить игру и подзаработать…
Что ж, будем переходить к изучению смешивания. Смешивание (blending) — это процесс комбинирования двух изображений, при котором находящееся ближе к зрителю кажется полупрозрачным. Представьте, что вы смотрите на предметы через кусок красного плексигласа в руке. Мир перед глазами становится красным, поскольку цвет плексигласа меняет окраску других объектов.
Чтобы претворить блендинг в реальность, нам понадобится частично прозрачный объект на переднем плане (в RGBA определении цвета значение альфа должно быть менее 1.0) плюс объект сзади, с которым он и будет “смешиваться”. Продолжить чтение »
 В этом уроке мы по-быстрому освоим оставшиеся последними примитивы — точки и линии. Ничего сложного, но мне уже пришлось ответить на несколько вопросов по данным объектам, поэтому я решил остановиться на них подробнее.
Итак, наша цель — оперативное знакомство с точками и линиями, которое позволит нам двигаться дальше в нужном направлении.
Главное, не взять слишком высокий темп. При вызове “glVertexPointer()” я буду работать с таинственным параметром “stride” (шаг индекса) Рассмотрим эту тему сейчас, поскольку один из следующих уроков будет посвящен объектам Blender в программировании на iPhone, позволяющим без особого труда обзаводится на экране объектами в неприлично больших количествах
Шаг индекса — интересный параметр, которым многие просто пренебрегают (как, собственно, до этого момента и я) или описывают как “слишком сложную тему, к которой вы еще не готовы” (возможно, потому, что сами ее еще не проработали….). Главное — разобраться в основах — и все станет понятно. Продолжить чтение »
 Сначала думал перейти к теме освещения, но решил, что мы еще не рассмотрели множество базовых вопросов, связанных с объектами и трансформациями. Сейчас в первую очередь я имею в виду трансформацию (анимацию) двух разных объектов разными способами в одном пространстве.
Помните, как мы применяли к сцене “glTranslatef()” и “glRotatef()“? Чтобы менять условия, я пользовался вспомогательной функцией “glLoadIdentity()“. Но для вычислительных ресурсов и визуализации сцен она “дорого обходится”, поэтому сейчас мы познакомимся с более эффективным методом.
Для этой цели введем новый объект: создадим пирамиду, переместим ее с помощью “glTranslatef()” и повернем независимо от куба с помощью “glRotatef()” — не обращаясь к “glLoadIdentity()” для сброса вершин.
Добавляем в пространство пирамиду
Вместо работы с треугольником предлагаю переключиться на трехмерные объекты и добавить пирамиду (практически точно такую же, как в Гизе).
В прошлом уроке я намеренно не упоминал, что созданный нами куб является сложной фигурой, т.е. состоит из нескольких примитивов. Мне кажется, что данный термин создает ощущение чего-то проблемного. Теоретически, квадрат — тоже сложный объект, но поскольку при рисовании мы обошлись одним вызовом функции OpenGL, будем считать его простым.
Итак, один сложный объект мы уже успешно создали! Приступаем ко второму.
Пирамиды не особенно проблематичны: основание-квадрат с присоединенными четырьмя треугольниками, соединяющимися над его центральной точкой. Любой интересующий объект создать гораздо проще, если мысленно разбить на простые составляющие. Меняется только количество задействуемых при его рисовании примитивов. Продолжить чтение »
 До сих пор мы с успехом осваивали плоские двухмерные объекты. Пришло время переходить к объемным — трехмерным. В принципе, они не намного сложнее, зато у них гораздо больше вершин (если создавать их из массива вершин) и трансформаций (если пытаться квадрат превратить в куб).
Наверное, сначала стоило рассмотреть точки и линии, но раз уж мы уже наложили текстуру на квадрат и раскрасили треугольники, будем скорее переходить к более интересным формам!
Вернемся мы еще и к трансформациям, и к вращению, рассмотрев их в деталях. Даже материалы для новичков мы еще не успели освоить в полном объеме… Так что впереди и нас еще множество уроков!!
Для начала урезаем метод “drawView”
Попрощайтесь с утомительным кодированием: убираем все лишнее и возвращаем метод “drawView” в первоначальное состояние. Продолжить чтение »
 Я решил перейти сразу к текстурам, рассудив, что накладывать их на объект с одной плоскостью проще, чем на многогранный (трехмерный). Поскольку при программировании в iPhone OpenGL ES именно этот момент вызывает наибольшее количество вопросов, вкратце остановимся на наложении текстур в общем.
Я многое пропустил в предыдущих уроках, чтобы сразу перейти к отображению на экране объектов и экспериментам с ними вместо бесчисленных страниц с описаниями различий между OpenGL ES и OpenGL. На этот раз придется углубиться в опущенные ранее технические детали.
С учетом того факта, что мы рассмотрим множество моментов, этот урок получится действительно длинным.
Как уже упоминалось, основная часть кода относится к загрузке текстур в программу и непосредственно в OpenGL для последующего использования. Ничего сложного, но поработать с iPhone SDK придется немало.
Готовимся к текстурам
Перед тем, как использовать текстуру, предварительно ее нужно загрузить в приложение, отформатировать для OpenGL и сообщить, где ее искать. Остальное будет ничуть не сложнее раскрашивания квадрата в прошлом уроке. Продолжить чтение »
 Я и обещал в прошлом уроке, устав от примитивных белых объектов на экране, начнем добавлять к ним цвета (помните исходный шаблон Apple, который мы удалили?) Просьба отнестись к этому уроку крайне внимательно, поскольку некоторые из представленных здесь концепций позже пригодятся нам в наложении текстур (да-да, осталось совсем немного).
В OpenGL ES цвет можно задавать сплошной заливкой для целого объекта, а можно раскрашивать объект, добавляя к нему полутона (когда цвета спектра плавно переходят один в другой). Начнем с самого простого — раскрасим наши объекты в один цвет.
Смена цвета, как обычно, переводит OpenGL в определенное «состояние»: все последующие операции рисования будут выполняться данным цветом, даже если вызвать для “сброса” функцию “glLoadIdentity()” (а все потому, что она работает только с вершинами). Поэтому с помощью всего одной строки кода мы можем окрасить наши объекты в любой цвет — пока остановимся на синем. Продолжить чтение »
 В этом уроке, базируясь на уже изученном материале, мы одновременно выведем на экран треугольник и квадрат — с перемещением. Перемещение объекта — один из видов трансформации.
К модели (объекту) в OpenGL ES применимы три разных вида трансформаций:
- Перемещение Translate — движение объекта в трехмерном пространстве.
- Вращение Rotate — вращение вокруг оси X, Y или Z.
- Масштабирование — изменение размеров объекта. Применяется преимущественно в системах двухмерной ортографической проекции, т.к. в трехмерном пространстве размер визуализируемого объекта уменьшается с его отдалением (т.е. с возрастанием негативного значения по координате Z). Подходит для “спецэффектов”.
Для демонстрации функциональных возможностей сначала одновременно выведем на экран квадрат и треугольник с помощью функции “Translate“, а после перейдем к двум следующим.
Перемещение
За эффект перемещения в OpenGL ES отвечает одна единственная функция с говорящим за себя названием — “glTranslatef()“. Обратили внимание на букву “f” после слова “translate”? Значит, OpenGL будет принимать данные с плавающей запятой. Для обработки данных с фиксированной точкой вызывается функция “glTranslatex()“. Этот вариант применим там, где аппаратное обеспечение не предусматривает сопроцессора для вычислений с плавающей точкой, но в iPhone он есть, поэтому будем придерживаться первой опции. Продолжить чтение »
Вообще-то, квадраты в OpenGL ES примитивами не являются, но работать с ними крайне удобно, а визуализировать — ничуть не сложнее треугольника. В этом уроке, взяв за основу код треугольника, мы превратим его в квадрат. Визуализацию опять будем выполнять статичную, но вплотную подберемся к трансформациям (т.е. перемещению). Само собой, позже квадрат можно будет превратить в куб, а потом и в куб с текстурами.
Краткий обзор прошлого урока и введение в следующий
На прошлом уроке, оттолкнувшись от «чистого холста» в виде проекта Xcode мы получили белый треугольник с заливкой. Для этого мы создали массив вершин, с помощью “glVertexPointer()” сообщили OpenGL о данных и их формате, активировали готовность к визуализации массива вершин и выполнили собственно рендеринг с помощью “glDrawArrays()“.
На сей раз, взяв этот код за основу, мы сделаем из треугольника квадрат. Для этого достаточно будет отредактировать пару строк кода. Во-первых, как все, наверное, уже догадались, количество точек с 3 нужно изменить на 4. Изменится и способ рисования, о чем и сообщим OpenGL через “glDrawArrays()“. Продолжить чтение »
Базовые фигуры (примитивы) — основные элементы, из которых при рисовании выстраиваются сложные объекты. В OpenGL ES такими примитивами выступают объекты Point (Точка), Line (Линия), Triangle (Треугольник). Думаю, их названия говорят сами за себя.
В этом уроке мы будем анализировать код, на основании которого впоследствии можно будет создавать собственные проекты.
Примитив №1 — треугольники
Треугольники — самые сложные из базовых фигур, но они настолько удобны и полезны, что с них мы и начнем. Чтобы нарисовать треугольник, необходимо указать OpenGL три координаты трехмерного пространства — остальное программа сделает сама.
Первым делом создайте копию проекта из урока “OpenGL ES: настройка проекта в Xcode” или загрузите исходный код отсюда. Открыв проект в Xcode, перейдите к файлу “EAGLView.m” и найдите метод “drawView“. Начинается настоящее волшебство!
Первым шагом зададим параметры треугольника. Сразу обращаю внимание на то, что мы будем работать с координатами двух типов: Model и World. Координаты Model относятся к отрисовываемому примитиву, а координаты World сообщают OpenGL о его местонахождении относительно зрителя (который в пространстве World всегда находится в точке (0.0, 0.0, 0.0)).
Итак, задаем координаты треугольника в пространстве Model через три трехмерные координаты (X, Y, Z):
1
2
3
4
5
| const GLfloat triangleVertices[] = {
0.0, 1.0, -6.0,// Верхняя центральная точка треугольника
-1.0, -1.0, -6.0,// нижняя левая
1.0, -1.0, -6.0,// нижняя правая
}; |
Заметьте, что координаты описаны последовательно, в направлении против часовой стрелки (оно может быть и противоположным — главное, задавать их последовательно и придерживаться единой схемы). Для начала я бы рекомендовал работу по схеме “против часовой стрелки”, поскольку именно такой порядок требуется для некоторых рассматриваемых ниже функций. Продолжить чтение »
Настройка OpenGL ES в Xcode на iPhone не представляет собой абсолютно ничего сложного, особенно после того как в пакет SDK разработчики из Apple добавили соответствующий шаблон. Все что нужно — это проект, в который легко и быстро добавляется нужный код. Именно этим мы и займемся в данном уроке.
Откровенно говоря, не вижу необходимости перенабирать весь приведенный здесь код. Если хотите сразу перейти к практическим проектам по OpenGL — пожалуйста. Пропустив урок по настройке, вы ничего не потеряете, поскольку вдаваться в подробности особо я не буду — можете переходить сразу в конец урока и загружать файл проекта.
Для начала запустим Xcode и создадим новый проект. Выберите шаблон “OpenGL ES Application” и сохраните проект, куда сочтете нужным.
Полагаю, что все уже в общих чертах знакомились с этим шаблоном, а, возможно, даже и запускали приложение. Сейчас нам предстоит удалить код для вращающегося цветного квадрата и добавить в представление буфер глубины (т.е. сделать его по-настоящему трехмерным). Полученный результат пригодится нам для последующих уроков. Продолжить чтение »
|
Загрузка ...
Комментариев: 3 »
(6 голосов, средний: 4.83 из 5)
Последние комментарии
Подскажите пожалуйста… Вот...
Код не открывает страницы по простой причине -...
можно было бы использовать сглаживание MSAA, графика была бы на...