Урок 1. Текстуры Хабрахабр. В прошлом уроке мы научились раскрашивать наши объекты в разные цвета. Но для того, чтобы добиться некого реализма нам потребуется очень много цветов. В прошлый раз, мы раскрашивали вершины треугольника, если мы пойдем тем же путем, то нам понадобится слишком большое количество вершин для вывода картинки. Заинтересовавшихся, прошу под кат. Начинаем. Open. GLСоздание окна. Hello Window. Hello Triangle. Если Вы ищете, где скачать текстуры, то предлагаем Вам наш сайт hdтекстур. Наши hdтекстуры бесшовные и проверены вручную на отсутствие. Придайте своим работам глубину с помощью текстур на платформе Canva. У нас есть все инструменты, чтобы добавить в ваши дизайны текстуру,. Помимо картинок, текстуры могут хранить большие наборы данных, отправляемых в шейдеры, но мы оставим этот вопрос для другого. Shaders. Текстуры. Трансформации. Системы координат. Программисты и художники предпочитают использовать текстуры. Текстура это 2. D изображение 1. D и 3. D текстура также существуют, используемое для добавления деталей объекту считайте, что текстура это кусок бумаги с картинкой кирпича к примеру, который наклеен на ваш дом и кажется, что ваш дом сделан из кирпича. Помимо картинок, текстуры могут хранить большие наборы данных, отправляемых в шейдеры, но мы оставим этот вопрос для другого урока. Ниже вы можете видеть текстуру кирпичной стены прилепленной на треугольник из прошлого урока. Для того, чтобы привязать текстуру к треугольнику мы должны сообщить каждой вершине треугольника, какой части текстуры принадлежит эта вершина. Каждая вершина, соответственно должна иметь текстурные координаты, ассоциированные с частью текстуры. Текстурные координаты находятся в промежутке между 0 и 1 по x и y оси мы же используем 2. D текстуры. Получение цвета текстуры с помощью текстурных координат называется отбором sampling. Текстурные координаты начинаются в 0, 0 в нижнем левом углу текстуры и заканчиваются на 1, 1 в верхнем правом углу. Изображение ниже демонстрирует как мы накладывали текстурные координаты на треугольник Мы указали 3 текстурные координаты для треугольника. Мы хотим, чтобы нижний левый угол треугольника соотносился с нижним левым углом текстуры, поэтому мы передаем 0, 0 нижней левой вершине треугольника. Соответственно в нижнюю правую вершину передаем 1, 0. Верхняя вершина треугольника должна соотноситься с центральной частью верхней стороной текстуры, поэтому мы передаем в верхнюю вершину 0. В результате текстурные координаты для треугольника должны выглядеть как то так GLfloat tex. Coords. Наша работа сообщить Open. GL как он должен проводить сэмплинг. Texture Wrapping. Текстурные координаты, зачастую, находятся в промежутке между 0,0 и 1,1, но что произойдет, если текстурные координаты выйдут за этот промежуток Поведение Open. GL по умолчанию повторять изображение фактически, просто игнорируется целая часть числа с плавающей точкой, но также есть и другие опции GL. Повсторяет текстуру. GL. В результате выходящие за пределы координаты будут привязаны к границе текстуры. GL. Изображение ниже отлично демонстрирует различия Каждую из вышепредставленных опций можно установить на оси s, t и r если вы используете 3. D текстуры, эквивалентны x, y и z с помощью функций l. Text. Parameter gl. Tex. ParameteriGL. Второе значение требуется для того, чтобы сообщить Open. GL какой конкретно параметр мы хотим установить. Мы хотим настроить опцию WRAP и указать ее значение для осей S и T. В последнем аргументе передается выбранный метод wrapping. В данном случае мы используем GL. Делается это fv альтернативой gl. Text. Parameter с передачей в нее GL. Эта проблема становится наиболее острой если требуется наложить текстуру низкого разрешения на большой объект. Возможно вы уже догадались, что в Open. GL есть опция для фильтрования текстур. Есть несколько доступных опций, но мы обсудим только наиболее важные GL. Пока он установлен Open. GL будет выбирать пиксель, который находится ближе всего к текстурной координате. Ниже вы можете видеть 4 пикселя и крест, показывающий текстурную координату. Поскольку центр верхнего левого тексель ближе всего к текстурной координате, то он и выбирается в качестве цвета сэмпла. GL. Принимает интерполированное значение от ближайших к текстурной координате текселей. Чем ближе тексель к текстурной координате, тем больше множитель цвета этого текселя. Ниже вы можете видеть пример смешивания цветов соседних пикселей Но какой же все таки визуальный эффект от выбранного эффекта фильтрования Давайте посмотрим как эти методы отработают с текстурой в маленьком разрешении на большом объекте текстура была увеличена для того, чтобы было видно отдельные тексели Mipmaps. Представьте, что у вас есть большая комната с тысячами объектов, к каждому из которых привязана текстура. Часть объектов ближе к наблюдателю, часть объектов дальше от наблюдателя и каждому объекту привязана текстура с высоким разрешением. Когда объект находится далеко от наблюдателя, требуется обработать только несколько фрагментов. У Open. GL есть сложности с получением правильного цвета для фрагмента с текстуры высокого разрешения, когда приходится учитывать большое количество пикселей текстуры. Такое поведение будет генерировать артефакты на маленьких объектах, не говоря уже о чрезмерной трате памяти связанной с использованием текстур высокого разрешения на маленьких объектах. Для решения этой проблемы Open. GL использует технологию, называемую мипмапами mipmaps, которая предусматривает набор изображений текстур где каждая последующая текстура вдвое меньше прошлой. Идея, которая лежит в основе мипмапов довольно проста после определенного расстояния от наблюдателя, Open. GL будет использовать другую мипмап текстуру, которая будет лучше выглядеть на текущем расстоянии. Чем дальше от наблюдателя находится объект тем меньше будет использоваться текстура, поскольку пользователю сложнее будет заметить разницу между разрешениями текстур. Также мипмапы имеют приятное свойство увеличивать производительность, что никогда не бывает лишним. Давайте посмотрим на пример мипмапы поближе Создание набора мипмап текстур для каждого изображения довольно муторно, но к счастью Open. GL умеет генерировать их с помощью вызова gl. Generate. Mipmaps после создания текстуры. Скоро мы увидим пример. Во время переключения между уровнями мипмапов в процессе отрисовки Open. GL может отображать некоторые артефакты, вроде острых краев между двумя уровнями. Также как возможно использование фильтрации на текстурах, также можно использование фильтрации на различных уровнях мипмапов с помощью NEAREST и LINEAR фильтрации для переключения между уровнями. Для указания способа фильтрации между уровнями мипмапами мы можем заменить стандартные методы одной из следующих четырех настроек. Пигров Руководство Хором. Это не даст никакого эффекта, поскольку мипмапы в основном используют при уменьшении текстуры. Увеличение текстуры не использует мипмапы, поэтому при передаче ему опции фильтрации мипмапа сгенерирует ошибку GL. Текстурные изображения могут храниться в безграничном количестве форматов, в каждом из которых своя структура и упорядоченность данных, так как же мы передадим наше изображение в приложениеОдним из решений является использование удобного нам формата, к примеру. PNG и написать собственную систему загрузки изображений в большой массив байт. Хоть написание собственного загрузчика изображений не представляет собой неподъемную работу, все таки это довольно утомительно, тем более если вы захотите использовать много форматов файлов. Другим решением является использование готовой библиотеки для загрузки изображений, которая бы поддерживала множество различных популярных форматов и делала много тяжелой работы за нас. К примеру SOIL. SOILSOIL расшифровывается как Simple Open. GL Image Library, поддерживает большинство популярных форматов изображений, легка в использовании и может быть скачана отсюда. Также как и большинство других библиотек вам придется сгенерировать файл. Вы можете использовать один из их проектов, располагающихся в папке projects не волнуйтесь, если версия их проектов будет ниже версии вашей VS. Просто сконвертируйте их в новую версию, это должно работать в большинстве случаев для создания на его основе собственного. Также добавьте содержимое папки src в свою папку include. Также не забудьте добавить SOIL. SOIL. h в начале вашего кода.